兩個不同的表單，輸入具有相同的名稱和編號

我在同一頁上有兩個表單，兩個標籤的for屬性指向兩個具有相同ID和名稱的複選框。兩個不同的表單，輸入具有相同的名稱和編號

當我點擊其中一個第二個表單標籤時，它會檢查第一個表單複選框。

在這種情況下，問題在於當你點擊「X名字2」的標籤，它會檢查「第十名」複選框，即使它們以不同的形式：

.customCheckbox div label { 
 
    padding: 5px; 
 
    background-color: white; 
 
    border: 2px solid #aaaaaa; 
 
    background-image: none; 
 
} 
 

 
.customCheckbox div input { 
 
    margin: 8px auto; 
 
    padding: 5px; 
 
    text-align: left; 
 
    margin-left: -999999px; 
 
    float: left; 
 
} 
 

 
.customCheckbox input[type=checkbox]:checked ~ label, 
 
.customCheckbox input[type=radio]:checked ~ label { 
 

 
    background-color: #117399; 
 
    color: #eeeeee; 
 
} 
 

 
.customCheckbox input[type=radio]:checked ~ label { 
 

 
    background-color: #117399; 
 
    color: #eeeeee; 
 
}

<form style="margin:30px;"> 
 
    <div class="customCheckbox"> 
 
    <div> 
 
     <input id="x" name="x" type="checkbox"/><label for="x">x name</label>  
 
    </div> 
 
    <br/> 
 
    <div> 
 
     <input id="y" name="y" type="checkbox"/> <label for="y">y name</label> 
 
    </div> 
 
    </div> 
 
</form> 
 
<form style="margin:30px;"> 
 
    <div class="customCheckbox"> 
 
    <div> 
 
     <input id="x" name="x" type="checkbox"/><label for="x">x name 2</label>  
 
    </div> 
 
    <br/> 
 
    <div> 
 
     <input id="y" name="y" type="checkbox"/> <label for="y">y name 2</label> 
 
    </div> 
 
    </div> 
 
</form>

我想從重命名元素遠離（因爲有相當多的地方發生這種情況）
我想嘗試從JavaScript遠離（如果可能）
由於我使用的CSS樣式的標籤和複選框我不能嵌套的標籤內的複選框（因爲你不能風格CSS父元素）

來源

2016-03-23 Beardo08

HTML ID應該是唯一的。如果不是，這樣的事情發生。 – dannyjolie

重複的ID在html中是非法的。你的代碼做的是正確的行爲 - 處理在文檔中找到的FIRST ID，並忽略其餘（欺騙）。閱讀getElementById（）的文檔。它返回一個DOM節點，而不是一個DOM節點列表，因爲ID不能被複制。如果它們可以，那麼函數將正確地命名爲getElement ** s ** ById。 –

這是不合法的使用相同id財產在同一頁上兩次。 根本就不重要如果元素是相同的形式或不同的形式。

他們可以絕對擁有相同的名稱名稱屬性。名字是什麼被髮送到您的服務器。如果需要，可以在同一個表單上使用相同名稱的五十個元素。

但是ID的全部用途是它們絕對必須在頁面上是唯一的。

所以，簡單地先做出一家... id="x1" name="x" ...和第二... id="x2" name="x" ...，然後讓你的標籤指向for="x1"或for="x2"

來源

2016-03-23 21:42:31 VoteyDisciple

這就是我所害怕的，謝謝你的確認:) – Beardo08

有沒有問題，當不同的輸入字段具有相同的名稱，只要它們是在不同的形式或它們代表相同的參數（例如在單選按鈕的情況下）。

但是，您應該從不對不同的HTML元素使用相同的ID。

從HTML5 specs：

id屬性指定其元素的唯一標識符（ID）。

如果您讓您的ID獨一無二，您的標籤將按預期工作。

來源

2016-03-23 21:57:25

兩個不同的表單，輸入具有相同的名稱和編號

回答

相關問題