Javascript函數似乎總是接收相同的輸入

我正在爲這段代碼奮戰幾個小時。無論我做了什麼選擇，輸出總是如同我選擇了第一行（set17，gpio17和第一個組合框中的任何內容）。Javascript函數似乎總是接收相同的輸入

我試着改變雙引號的單引號，嘗試了不同的瀏覽器，併爲每一行定義了不同的ajaxFunctions，但結果總是相同的。

預期的結果是，例如，當警報框的組合框被更改時，警報框中的GPIO24行的值。

任何人都可以用清新的頭腦告訴我我做錯了什麼？

順便說一句，有沒有辦法將$ item和$ action變量傳遞給「document.getElementById」，而無需創建文本框？

在此先感謝

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<body> 

<script type="text/javascript"> 
function ajaxFunction(){ 
var action = document.getElementById('action'); 
var item = document.getElementById('item'); 
var value = document.getElementById('value'); 
alert("You entered: " + " " + action.value + " " + value.value + " " + item.value) 


} 
</script> 


<center><b>AJAX TEST PAGE</b><br/><br/><table border="1"><tr> 

<td>gpio17</td><td> Sensor Wireless #3 <td> 
<form name='gpio17'> 
<select id='value' onchange='ajaxFunction()'> 
<option value= value_option_1> value_option_1</option> 
<option value='value-option_1'>Option_1_display</option> 
<option value='value-option_2'>Option_2_display</option> 
<option value='value-option_3'>Option_3_display</option> 
</select><td> 
<input type='text' id='action' value='set17' /> <br /> 
<input type='text' id='item' value='gpio17' /></td></form></td></tr><tr> 

<td>gpio23</td><td> Sensor Wireless #2<td> 
<form name='gpio23'> 
<select id='value' onchange='ajaxFunction()'> 
<option value= value_option_2> value_option_2</option> 
<option value='value-option_1'>Option_1_display</option> 
<option value='value-option_2'>Option_2_display</option> 
<option value='value-option_3'>Option_3_display</option> 
</select><td> 
<input type='text' id='action' value='set23' /> <br /> 
<input type='text' id='item' value='gpio23' /></td></form></td></tr><tr> 

<td>gpio24</td><td> Sensor Wireless #1<td> 
<form name='gpio24'> 
<select id='value' onchange='ajaxFunction()'> 
<option value= value_option_1> value_option_1</option> 
<option value='value-option_1'>Option_1_display</option> 
<option value='value-option_2'>Option_2_display</option> 
<option value='value-option_3'>Option_3_display</option> 
</select><td> 
<input type='text' id='action' value='set24' /> <br /> 
<input type='text' id='item' value='gpio24' /></td></form></td></tr><tr> 

<td>gpio25</td><td> Sensor Wireless #0 
<td><form name='gpio25'> 
<select id='value' onchange='ajaxFunction()'> 
<option value= value_option_3> value_option_3</option> 
<option value='value-option_1'>Option_1_display</option> 
<option value='value-option_2'>Option_2_display</option> 
<option value='value-option_3'>Option_3_display</option> 
</select><td> 
<input type='text' id='action' value='set25' /> <br /> 
<input type='text' id='item' value='gpio25' /></td></form></td></tr> 

</table> 

</body> 
</html>

來源

2014-01-05 user2433937

爲什麼你有多個元素具有相同的'id'屬性？它應該是獨一無二的。 –

你的HTML是無效：id屬性必須是唯一的。如果您使用的document.getElementById()的ID不是唯一的，則只會返回一個元素（在大多數瀏覽器中，它將是第一個元素）。

可以傳遞給特定元素的引用，該事件被觸發這樣的：

<select id='makethisuniqueordeleteattributecompletelyifnotused' 
     onchange='ajaxFunction(this)'>

「有什麼辦法打發$項目和$行動變數」的文件。 getElementById「而不需要創建文本框？」

是的。由於它們只是字符串值，你可以這樣做：

<select id='makethisuniqueordeleteattributecompletelyifnotused' 
     onchange='ajaxFunction(this,"set17","gpio17")'>

然後你就可以改變你的函數接受這些值如下：

function ajaxFunction(el, action, item){ 
    // selected value of select element in question: 
    var value = el.value; 
    alert("You entered: " + " " + value + " " + action + " " + item); 
}

演示：http://jsfiddle.net/8ACHe/

來源

2014-01-05 04:16:29 nnnnnn

Javascript函數似乎總是接收相同的輸入

回答

相關問題