如何通过JavaScript函数获取输入数组值？

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

而不是试图找出与索引的文本框，就聚集起来，并将它们放入一个数组或类似数组的容器中，其中索引将自动分配给它们。

下面是如何通过指数来获得值的工作例如：

// 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

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

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事件的目标，

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

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

，或者更好，附上你的听众在javascript：

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); 
 
};

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

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()); 
} 

我希望我有帮助