Question

看看这个link，我认为课程实际上是索引的。如果我有这个代码，我怎样才能在JavaScript或jQuery中点击按钮类的索引？

<button class="class_name" id="b1"></button>
<button class="class_name" id="b2"></button>

Answer 1

在jquery中的

： $（“＃b1”）。index（）

编辑：刚刚看到你的更新，你可以在jquery中按钮点击索引

$('button').click(function (event) {
    alert($(this).index());
});

Answer 2

DEMO ：http://jsfiddle.net/mg7zau4c/

jQuery index

从匹配的元素中搜索给定元素。

$('.class_name').on('click', function(){
    console.log($(this).index());
});

感谢。如何从这返回id？ - 句法7分钟前

$(this).attr('id');

Answer 3

您可能会想到由NodeList返回的var nodes = document.querySelectorAll('.class_name')，然后可以nodes.length和console(nodes[1].id)。

see MDN

Answer 4

没有jQuery：

var index, 
    buttons = document.getElementsByClassName('class_name');
for(var i=0;i<buttons.length;i++){
    buttons[i].onclick = function(){
        for(var j=0;<buttons.length;j++){
             if(buttons[j]==this) {
                 index = j; //console.log(j), etc
                 break;
             }
        }
    }
}

少了一个大括号和一个fiddle：

[].slice.call(document.getElementsByClassName('class_name')).forEach(function(o,i,arr){
    o.onclick = function(){
       var index, that = this;
       var search = arr.some(function(b,j){
           index = j;
           return that == b;
       });
       alert(index);
   }
});

NodeLists始终有序，但如果您重新排序元素，则必须再次查询getElementsByClassName。

如何知道单击类中的哪个索引

4 个答案: