在JavaScript中選擇多個ID
[英]Select Multiple Id's in Javascript
問題描述
我對編程完全陌生，請使用以下代碼幫助我。
<body>
<p>
<select id="Ultra" onchange="">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</p>
<p>
<select id="Ultra" onchange="showData()">
<option value="0">1</option>
<option value="1">2</option>
<option value="2.0">3</option>
<option value="3.0">4</option>
</select>
</p>
<p id="data">
<script>
function showData()
{
var data =[[0,23,A],[1,33,B],[2,44,c],[3,55,D]];
var html = "";
var x = new Array();
x = document.querySelectorAll("Ultra")
for (var i=0; i<data.length; i++)
{
if(data[i][0]== x[1])
{
html = data[i][1] ;
}
}
document.getElementById("data").innerHTML = html;
}
</script>
</p>
</body>
我正在創建具有相同ID的兩個下拉列表，之后我只想檢索Second Select ID的值。
故意地，我沒有為第一個Select編寫任何功能，我只是在檢查querySelectorAll方法
在“第一次迭代”中，我在下拉列表中選擇“ 1”，x [1]表示數字選擇ID = 0 data [i] [0] = 0
我期望的輸出為23.。但是，它不起作用！
我使用querySelectorAll方法做錯了什么嗎？
3 個解決方案
解決方案1
2 已采納 2015-03-05 06:41:58
由於元素的ID必須是唯一的，因此請勿在頁面中使用重復的ID。
對於您的問題，您可以將更改后的元素引用作為參數傳遞給類似
<p>
<select class="Ultra" onchange="">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</p>
<p>
<select class="Ultra" onchange="showData(this)">
<option value="0">1</option>
<option value="1">2</option>
<option value="2.0">3</option>
<option value="3.0">4</option>
</select>
</p>
<p id="data"></p>
然后
function showData(el) {
var data = [
[0, 23, 'A'], //the string literals like `A` must be enclosed in '' or ""
[1, 33, 'B'],
[2, 44, 'c'],
[3, 55, 'D']
];
var html = "";
for (var i = 0; i < data.length; i++) {
if (data[i][0] == el.value) { //need to test against the value of the select
html = data[i][1];
}
}
document.getElementById("data").innerHTML = html;
}
演示： 小提琴
解決方案2
1 2015-03-05 06:54:00
function showData() { var data =[[0,23,'A'],[1,33,'B'],[2,44,'c'],[3,55,'D']]; var html = ""; var x = new Array(); x = document.querySelectorAll("#Ultra") for (var i=0; i<data.length; i++) { if(data[i][0]== x[1].value) { html = data[i][1] ; } } document.getElementById("data").innerHTML = html; }
進行的更改：1）querySelectorAll（'＃ultra'）2）x [1] .value
這有效
解決方案3
0 2015-03-05 06:38:30
將id屬性替換為class 。
class = "Ultra"
它會工作。
如何在具有不同ID的多個Select元素上使用相同的JavaScript函數
[英]How to use the same JavaScript Function on Multiple Select elements with different ID's
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.