JQuery文档+每个+上

Question

只是想知道我是否可以在JQuery中使用带有.on（）的.each（）方法，如下所示：

$(document).each.on("change","input[type='color']",function(){});

我可能甚至没有接近正确的解决方案，因为我是JavaScript和JQuery的新手

实际上我在网站上需要的是我需要在模态中获取每个输入[type ='color']并在每个输入上更改，在文本框中写入每个输入的值

这是我的函数代码：

$(document).on("click","#createTheme",function(){
    $("#createThemeDialog").css("display","block");
    $("input[type='color']").each.on("change",function(){
        var css=$(this).attr("name")+"{"+$(this).attr("label")+":"+$(this).val()+"!important}";
        $("#output").val($("#output").text()+css);
    });
});

但输出只是更改输入的一个值[type ='color']

那么，有没有办法在每次输入[type ='color']的变化时使#output显示每个输入[type ='color']的显示值，并在更改时动态更新它？

非常感谢您将宝贵的时间花在我的问题上！非常感谢您的帮助！

Salvad B @ Gurvinder 372

感谢大家！

Answer 1

那么，有没有办法在input[type='color']的变化上制作每个each input[type='color']的#output显示值并在变化时动态更新？

您可以为所有change委派input[type='color']事件，并使用map为所有这些事件返回相同的生成字符串。

$( document ).on( "change","input[type=color]",function(){
   //now get the values from all "input[type=color]"
   var css = $( "input[type=color]" ).map( function() {
      var $this = $(this);
      return $this.attr("name") + "{" + $this.attr("label") + ":" + $this.val() + "!important}"; //the same string you were generating
   }).get().join( "," );
   $("#output").val( css );
});