網頁看起來像這樣。我在代碼中有兩個數組作為輸入，想在 showscore() 函數中檢索數組的內容，我粘貼了我嘗試過的代碼片段。該查詢將給出一個字符串列表，這些字符串存儲在 arr1 和 arr2 中，并在以后的代碼中進行混洗。將混洗后的 arr1 顯示給用戶，然后使用存儲在城市數組中的表單輸入響應。<script type="text/javascript" src="scripts/getScore.js"></script><div id="score"> <?php for ($i = 0; $i < $number; $i = $i + 1) { ?> <form id="main"> <?php echo $string1 . " " . $state[$i] . " " . $string2 ?> <input type="text" placeholder="Enter answer" name="city[]" required /> <?php } ?> <input type='hidden' name='capital[]' value="<?php echo json_encode($capital); ?>" /> <button type="button" value="Submit" onclick="showscore()">Submit</button> </form> </div>getScore.js 中的 showscore() 函數是：function showscore() {var request;if (window.XMLHttpRequest) { request = new XMLHttpRequest();}else { request = new ActiveXObject("Microsoft.XMLHTTP");}request.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { console.log(this.responseText); document.getElementById("score").innerHTML = this.responseText; }};var myForm = document.forms.main;var city = mForm.elements['city[]'];var capital=myForm.elements['capital[]'];console.log(city);console.log(capital[0]);var c =0;for (var i = 0; i < capital.length; i++) { console.log(capital[i]); console.log(city[i]); if(city[i] == capital[i]){ c++; }}console.log("Your Score is "+c);}
1 回答
守著一只汪
TA貢獻1872條經驗 獲得超4個贊
您不能有重復的 ID。
您使用 form.name 而不是腳本中的 ID。更改為類并遍歷 document.querySelectorAll(".formClass")
為什么不對城市和首都進行 JSON 編碼，而只是在腳本中使用它們呢？然后您可以在客戶端生成表單
我的建議 - 未經針對您的陣列進行測試，因為我沒有您的城市和資本陣列的示例。
const states = {
"Odisha": ["Bhubaneswar"],
"Andhra Pradesh": ["Amaravati", "Hyderabad"]
} // <?php echo json_encode(states); ?>;
const form = document.getElementById("main");
let html = ['<fieldset>']
Object.keys(states).forEach(state => html.push(`<label>What is the capital of ${state}?</label> <input type="text" data-state="${state}" placeholder="Enter answer" name="city[]" required />`));
html.push('<button type="button" id="checkBut">Check</button> <div readonly id="total"></div>')
html.push('</fieldset>')
form.innerHTML = html.join('<hr>')
window.addEventListener("load", function() {
document.getElementById("checkBut").addEventListener("click", () => {
let c = 0;
[...document.querySelectorAll("[name^=city]")].forEach(input => c += states[input.getAttribute("data-state")].indexOf(input.value) !== -1 ? 1 : 0);
document.getElementById("total").innerText = "Your Score is " + c;
});
});
#score {
width: 80%
}
fieldset {
min-width: 500px;
display: inline-block;
}
fieldset input {
float: right;
}
#total {
float: right;
}
<div id="score">
<form id="main">
</form>
</div>
- 1 回答
- 0 關注
- 126 瀏覽
添加回答
舉報
0/150
提交
取消