無效的HTML:具有相同ID 的多個元素
問題描述:
問題描述:問題描述: 問題描述:
問題描述在給定HTML 結構,有三個具有相同ID「xyz」的按鈕。但是,當使用 jQuery ID 選擇器 $("#xyz") 處理 onClick 事件時,只有第一個按鈕有回應。其他按鈕將被忽略。
分析:
jQuery ID 選擇器旨在選擇文件中具有匹配 ID 的第一個元素。但是,根據 W3C 規範,ID 值在文件中應該是唯一的。多個元素具有相同的 ID 被視為無效 HTML。<button type="button" class="btn btn-primary xyz" value="1">XYZ1</button> <button type="button" class="btn btn-primary xyz" value="2">XYZ2</button> <button type="button" class="btn btn-primary xyz" value="3">XYZ3</button>
如 jQuery API 文件中所述,如果多個元素具有相同的 ID,則 jQuery 選擇器將只選擇第一個符合的元素。不建議依賴此行為,應修正 HTML 以確保 ID 的唯一性。
解決方案:$(".xyz").click(function(){ // Get the value of the button that was clicked var xyz = this.value; // Display the value in an alert box alert(xyz); });
以上是為什麼 jQuery 只選擇第一個具有重複 ID 的元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!