javascript - 如何获取使用“this”关键字传递的 jQuery html 对象的属性

Question

JQuery/JS 新手在这里 - 但到目前为止享受学习体验。

我的场景：

我有多个按钮，如下所示：

<button id="thumb-1" class="thumbs">click 1</button>
<button id="thumb-2" class="thumbs">click 2</button>
<button id="thumb-3" class="thumbs">click 3</button>

当用户单击一个时，我通过this关键字将其传递给自定义函数，如下所示：

$('.thumbs').click(function(){
    $.fn.myFunc(this);
}

这会将 jQuery 对象发送到函数，即整个按钮 html。

<button id="thumb-x" class="thumbs">click x</button>

现在我要做的是获取该按钮的 id 并将其存储在字符串变量中。使用以下内容当然不起作用，html 按钮元素没有 attr 方法。

$.fn.myFunc = function(button) { 
    var id = button.attr('id');
}

有人有任何简单的想法吗？

谢谢！- 詹姆士

Answer 1

如果你想使用attr()然后将按钮转换为 jquery 对象，或者如果你想从javascript对象中获取 id 然后使用button.id

$.fn.myFunc = function(button) { 

    var id = $(button).attr('id'); // with jquery object
    id = button.id; //with javascript object 
}

Answer 2

在使用 jQuery 函数之前，您需要将其设为 jQuery 对象

$.fn.myFunc = function(button) { 
    var id = $(button).attr('id');
}

Answer 3

如果您从 myFunc 发送“this”，则无需使用 jquery attr，我们可以直接访问，这样会更快更容易

$(".thumbs").click(function(){
$.fn.myFunc(this);
});
$.fn.myFunc = function(button) {
alert(button.id);
}

请参考下面的小提琴

http://jsfiddle.net/m2Ts5/18/

谢谢