javascript - 如何使用jquery从输入文本数组中检测当前输入文本的索引

Question

我有一个输入文本框数组，简化如下:

<input type="text" name="quantity[3]" value="0">
<input type="text" name="quantity[6]" value="0">
<input type="text" name="quantity[7]" value="0">
<input type="text" name="quantity[11]" value="0">

这两种方式对我来说都可以接受，但我什至不知道如何做到其中一种:

当第三个输入框(索引为 7)更改时，两个 alert() 中的任何一个对我来说都是可以接受的:

• 7(因为第三个文本框的真实索引是7)
• 2(因为可能会从 0 开始计数，因此索引为 2)

我的不起作用的代码是:

$(document).ready(function(){
    $('input[name^=quantity]').change(function(){
        alert($(this).index());
    });
})

链接:http://niamco.com/cp/problem.html

预计当用户更改任何数量文本框时，文本框的val()以及其正确的index( )。我们看到 val() 正确输出，但 index() 始终返回 0。

由于 val() 是正确的，我们应该确保 jQuery 加载良好并且工作正常。那么为什么 index() 不应该为 true 呢？

奇怪的是，据我研究，val() 和 index() 都是 jQuery 功能。如果 val() 是 javascript 基础，则可以接受。但现在，一个 jquery Base 函数可以工作，而另一个则不能!

Answer 1

.index() 获取元素相对于其同级元素的当前位置。您应该使用正则表达式来获取输入名称中 [ 和 ] 之间的数字。

改用这个:

$('input[name^=quantity]').change(function () {
    var index = $(this).prop('name').match(/\[(.*?)\]/)[1];
    console.log(index);
});

这里正在工作:http://jsfiddle.net/u8HRq/1/

更新:根据您的更新，这是一个有效的 fiddle :http://jsfiddle.net/qbmAU/2/

首先，id 应该是唯一的，因此我已将它们更改为类，并更新了 change 事件的选择器。

我还让 .index() 正常工作:

$(this).index('.quantity')

index() 通常通过返回相对于匹配兄弟的位置来工作，这就是我和 j08691 的答案有效的原因。但是，如果元素不是兄弟元素，那么您可以将选择器作为参数传递。这将返回当前元素相对于匹配元素的索引。