21cc00选择器

Question

我有大约8种类型：

<input type="text" id="color1" name="color1" class="colorwell" value="#ffffff" />

到

<input type="text" id="color8" name="color8" class="colorwell" value="#ffffff" />

我在varaibile中有颜色

 $('#picker').farbtastic('#color_picker_input').mouseup(function (){
      var colore = $.farbtastic('#picker').color;
 alert(colore);});

但我还要确定名称或ID

看起来像

的东西

var nome = $.farbtastic('#picker').name;

这不起作用。我做错了什么？

Answer 1

我没有使用过Farbtastic，但您应该能够console.log($.farbtastic('#picker'))在JavaScript控制台中查看有关该对象的所有信息。从中您可以确定名称的存储位置或获取名称的方式（如果它是一种方法）。

您也可以使用jQuery的默认attr()方法：

$.farbtastic('#picker').attr('name');
// Or
$('#picker').attr('name');

我刚刚在官方网站上试过这个，事实上就是这样：

根据Farbtastic documentation，无法通过name对象调用id或farbtastic。你需要回到通用的jQuery：

$('#picker').attr('name');
$('#picker').attr('id');

Answer 2

获取所有id，然后推送到数组：

var ids = [];

$('.colorwell').each(function(){
    ids.push(this.id);
});
console.log(ids);

JS Fiddle demo

获取其他详细信息，并使用各种属性填充对象，或者更确切地说是对象的数组：

var colorwells = [],
    self;

$('.colorwell').each(function(){
    self = this;
    colorwells.push(
        {
            id : self.id,
            name : self.name,
            value : self.value
        }
    );
});
console.log(colorwells);

JS Fiddle demo

专门解决您的问题，并记住我从未使用过farbtastic（作为开发人员，虽然我知道它广泛用于UI），并假设您发布的代码（提醒颜色）有效，那我建议：

$('#picker').farbtastic('#color_picker_input').mouseup(function (){
    var colore = $.farbtastic('#picker').color,
        nome = this.id || '';
        console.log(colore, nome);
});

这应该检索当前DOM节点的id或空字符串（以防止有关undefined字符串/属性/对象的错误消息）。

当$(this).attr('id')或$(this).prop('id') 工作时，调用jQuery来检索DOM节点的属性是不必要的（在没有将节点包装到jQuery对象中的情况下完全可用））。

Answer 3

按照你的建议写作

  $('#picker').farbtastic('#color_picker_input').mouseup(function (){
            var colore = $.farbtastic('#picker').color,
            nome = this.id || '';
          console.log(colore, nome);
                 // alert(nome);        
    });

控制台日志上的

我读到了：

21cc00选择器

Answer 4

问题解决了！

$('#picker').farbtastic('#color_picker_input').mouseup(function (){

     var   nome = $("input:text:focus").attr("id");
     var   colore = $.farbtastic('#picker').color;

          console.log( colore, nome);
...

以这种方式我确定使用了哪个文本框

用farbtastic识别名称或id

4 个答案:

21cc00选择器