将第 n 个类型选择器加载到变量中

Question

我有一个 JQuery，它对同一元素的不同迭代给出不同的结果。

例如；

<div>Hello</div> 
<div>click</div>
<div>here</div>
...
<div>The end</div>

我想创建一个循环，JQuery 根据单击的

Div

给出不同的结果；像这样的：

//var n = which div number.
var outputData = ['first', 'second', 'third', ..., 'thank you'];
$('div').click(function() {
    // where 'n' should be the nth-of-type number of the div that's been clicked.
    $(this).text(outputData[n]);

});

但是我无法让 JQuery 接受单击

nth-of-type

来返回正确的结果。

研究：

我已经阅读了如何获取第n个jQuery元素和循环变量作为第n个类型选择器，并阅读了有关

:eq()

的内容，但这些都显示了硬编码编号，而不是动态分配第n个类型。如何为 JQuery 提供不同点击的动态第 n 个

div

？

Answer 1

作为解决方案，我在元素上使用了

data-

属性，然后将其用作手动参考：

<div data-count='1'>Hello</div> 
<div data-count='2'>click</div>
<div data-count='3'>here</div>
...
<div data-count='n'>The end</div>





//var n = which div number.
var outputData = ['first', 'second', 'third', ..., 'thank you'];
$('div').click(function() {
    counter = $(this).data('count') - 1;
    // where 'n' should be the nth-of-type number of the div that's been clicked.
    $(this).text(outputData[counter]);

});