Chrome Extension Popup表單中的多個提交按鈕

Question

我正在開發一種保存到存儲的擴展程序，如果表單中有多個具有相同ID（名稱不多，ID是chrome擴展程序的標識符）的按鈕，則無法進行檢查。

<tr>
  <td colspan="2">
   <input type="Submit" value="Add" id="action" name="action" style="width: 100%" /></td>
 </tr>    
<tr>
  <td colspan="2">
  <input type="Submit" value="Edit" id="action" name="action" style="width: 100%" /></td>
</tr>

不會觸發我的js（如下），但這會

<tr>
  <td colspan="2">
   <input type="Submit" value="Add" id="action" name="action" style="width: 100%" /></td>
 </tr>

JS

function manageItem() {
    if (action.value=='Add') {
        ...
    }
}

我的意圖是像

function manageItem() {
    if (action.value=='Add') {
        ...
    } else if (action.value='Edit') {
        ...
    }
}

如果我只有一個帶有id動作的按鈕，則此方法有效。 如果我有多個按鈕，則根本不起作用。

例如，當瀏覽器提交服務器端腳本時，只有單擊的提交按鈕才發送其值，因此這種情況將適用於此（僅作為示例）。

我嘗試以自己的形式測試每一行，但是當兩個元素具有相同的ID時，仍然會發生沖突。 我能做什么？

編輯：我以為我已經包含在我的問題中，我確實知道ID不能重復，但是我沒有明確地說過。 我知道在格式正確的html中，ID不能重復，但是我不知道如何實現。

Answer 1

您應該使用class="action"而不是id="action" ， id不能重復。

另外，還有一個錯字： if (action.value='Edit') {將if (action.value='Edit') {替換為if (action.value=='Edit') {

---

在當前的HTML，你並不真正需要的既不是 ID或類別（但仍需名） -你可以刪除這些屬性， 也不

function manageItem() {
    if (action.value=='Add') {
        ...
    } else if (action.value='Edit') {
        ...
    }
}

要區分按鈕，您可以使用以下命令：

document.getElementsByName("action")[0].onclick=function(){
    //first button clicked
}

document.getElementsByName("action")[1].onclick=function(){
    //second button clicked
}