Question

下面是示例代码我尝试使用键创建输入数组，并且在更改时我想获取单个输入数组值的值。

<input type="text" name="items[1]" value="443" onchange="get_items(1)">
<input type="text" name="items[2]" value="233" onchange="get_items(2)">
<script>
       function get_items(key)
        {
          alert($("items["+key+"]").val());
        }

</script>

Answer 1

只需将this上下文作为参数传递并获取值。

<input type="text" name="items[1]" value="443" onchange="get_items(this)">
<input type="text" name="items[2]" value="233" onchange="get_items(this)">
<script>
  function get_items(ele) {
    alert(ele.value);
  }
</script>

Answer 2

您的HTML缺少name属性的结束语。
name属性不应包含[或] 字符。添加这些字符会使问题复杂化。
您应该使用JavaScript而不是HTML来连接事件处理程序。
在可行的情况下，元素应添加唯一的id属性，这样可以在JavaScript和CSS中更轻松地访问和识别它们

不是尝试使用索引识别文本框，而是将它们收集起来并将它们放入数组或类似数组的容器中，索引将自动分配给它们。

以下是如何通过索引获取值的工作示例：

＆＃13;

// This will scan the DOM and place all matched elements into a node list
// which is an array-like object
var textBoxes = document.querySelectorAll("input[type=text]");

// Or, you can get references to them individually:
var txt1 = document.getElementById("txt1");
var txt2 = document.getElementById("txt2");

// And, put them into an array on your own:
var ary = [txt1, txt2];

// No matter how you got your references to them, it's best to hook
// them up to event handler in JavaScript, not HTML
txt1.addEventListener("change", get_items2);
txt2.addEventListener("change", get_items2);

function get_items(key) {
  // You can certainly pass a key to this function
  // to identify which element you are talking about
  alert(textBoxes[key].value);
  
}

function get_items2(evt) {
  // But, event handlers are automatically passed
  // a reference to the object that fired the event
  alert(evt.target.value);
  
}

get_items(0);  // Call the function to get first textbox value
get_items(1);  // Call the function to get second textbox value

＆＃13;

<input type="text" id="txt1" name="txt1" value="443">
<input type="text" id="txt2" name="txt2" value="233">

＆＃13;

Answer 3

参考fiddle

HTML：

<input type="text" name="items[1]" value="443" onchange="get_items(1)">
<input type="text" name="items[2]" value="233" onchange="get_items(2)">

JS：

function get_items(key)
        {
          alert($('input[name="items['+key+']"]').val());
        }

Answer 4

您可以从event

获取活动的目标

＆＃13;

function get_items(e) {
   console.log(e.target.value); 
}

＆＃13;

<input type="text" name="items[1]" value="443" onchange="get_items(event)">
<input type="text" name="items[2]" value="233" onchange="get_items(event)">

＆＃13;

或者更好的是，在javascript中附加您的监听器：

＆＃13;

function get_items(e) {
   console.log(e.target.value); 
};

var inputs = document.querySelectorAll("input");

for (var i = 0, el; i < inputs.length; i += 1) {
  el = inputs[i]
  el.addEventListener("change", get_items);
};

＆＃13;

<input type="text" name="items[1]" value="443">
<input type="text" name="items[2]" value="233">

＆＃13;

Answer 5

以下是一些代码可以执行（我认为）您尝试执行的操作：

<input type="text" name="item1" value="443" onchange="javascript:get_items(1)">
<input type="text" name="item2" value="233" onchange="javascript:get_items(2)">
<script>
    function get_items(key)
    {
        //alert($("items["+key+"]").val());
        var input = $('input[name="item' + key + '"]');
        var value = input.val();
        alert(value);
    }
</script>

jsfiddle：https://jsfiddle.net/9kvv2q7p/4/

Answer 6

您可以使用此

function get_items(key) {
    alert($("input[name='items[" + key + "]']").val());
}

我希望我有所帮助

如何通过javascript函数按键获取输入数组值？

6 个答案: