多维输入名称上的JQuery activeElement

Question

如果我有类似下面代码的表单输入字段，我可以算出＆＃34; index＆＃34;是重点？

<input type="text" name="myField['item_name'][]"> // index 0
<input type="text" name="myField['item_qty'][]"> // index 0

<input type="text" name="myField['item_name'][]"> // index 1
<input type="text" name="myField['item_qty'][]"> // index 1

<input type="text" name="myField['item_name'][]"> // index 2
<input type="text" name="myField['item_qty'][]"> // index 2

如果第一个项目已填满并且用户选择了另一个项目输入，我怎么能确定哪个＆＃34;索引＆＃34;被选中了？

Answer 1

  

使用.index() 从匹配的元素中搜索给定元素

试试这个：

＆＃13;

＆＃13;

$('[name="myField[\'item_name\'][]"]').on('focus', function() {
  alert($('[name="myField[\'item_name\'][]"]').index(this))
});

$('[name="myField[\'item_qty\'][]"]').on('focus', function() {
  alert($('[name="myField[\'item_qty\'][]"]').index(this))
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="text" name="myField['item_name'][]">// index 0
<input type="text" name="myField['item_qty'][]">// index 0

<input type="text" name="myField['item_name'][]">// index 1
<input type="text" name="myField['item_qty'][]">// index 1

<input type="text" name="myField['item_name'][]">// index 2
<input type="text" name="myField['item_qty'][]">// index 2

＆＃13;

＆＃13;

＆＃13;

Fiddle here

要在动态添加的元素上绑定事件，请使用Event delegation

试试这个：

＆＃13;

＆＃13;

$(document).on('focus', '[name="myField[\'item_name\'][]"]', function() {
  alert($('[name="myField[\'item_name\'][]"]').index(this))
});

$(document).on('focus', '[name="myField[\'item_qty\'][]"]', function() {
  alert($('[name="myField[\'item_qty\'][]"]').index(this))
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="text" name="myField['item_name'][]">// index 0
<input type="text" name="myField['item_qty'][]">// index 0

<input type="text" name="myField['item_name'][]">// index 1
<input type="text" name="myField['item_qty'][]">// index 1

<input type="text" name="myField['item_name'][]">// index 2
<input type="text" name="myField['item_qty'][]">// index 2

＆＃13;

＆＃13;

＆＃13;

Updated Fiddle

Answer 2

尝试在foucs上使用索引

$("input[type='text'][name^='myField']").focus(function(){
  console.log($(this).index())
})