<button>在Firefox和IE中的行爲

我有一個表，並在每行的末尾有一個按鈕，以便用戶可以刪除該行。我這樣做：<button>在Firefox和IE中的行爲

<td><button type=submit name=delete value=1>delete</button> 
<td><button type=submit name=delete value=2>delete</button> 
<td><button type=submit name=delete value=3>delete</button> 
<td><button type=submit name=delete value=4>delete</button>

但是這在IE中不起作用，窗體發送刪除而不是值。我也試過：

<td><input type=submit name=delete value=1> 
<td><input type=submit name=delete value=2> 
<td><input type=submit name=delete value=3> 
<td><input type=submit name=delete value=4>

但隨後的按鈕上的文字是一個數字，而不是文字刪除。

是否有無論如何我可以添加一堆提交按鈕到一個表單，都說刪除，但執行不同的操作？由於表單無法嵌套，因此我無法使用單獨的表單。

來源

2009-09-15 Roland Rabien

但是你可以在你的表單中使用不同的'fieldsets'，並且每個fieldset都可以 - 我想 - 有它自己的submit/reset/whatever按鈕。 – 2009-09-15 17:30:25

這是Internet Explorer中的一個已知錯誤，最終在版本8中修復。 – NickFitz 2009-09-15 17:40:20

您需要讓每個按鈕都具有自己的窗體。如果你的設計不會讓你這樣做，那麼你的設計可能有缺陷 - 使用CSS而不是表格。 – 2009-09-15 17:47:02

如何處理一些JavaScript和隱藏的表單字段？

<input type="hidden" name="deleteID" value="" /> 

<script type="text/javascript"> 
function deleteID(theid) 
{ 
    theFormName.deleteID = theid; 
    theFormName.submit(); 
} 
</script>

以及按鈕：

<td><input type="button" name="delete" value="Delete" onclick="javascript:deleteID(1);" /></td> 
<td><input type="button" name="delete" value="Delete" onclick="javascript:deleteID(2);" /></td> 
<td><input type="button" name="delete" value="Delete" onclick="javascript:deleteID(3);" /></td> 
<td><input type="button" name="delete" value="Delete" onclick="javascript:deleteID(4);" /></td>

而在服務器端腳本，您可以檢查是否deleteID設置，並根據需要刪除。

來源

2009-09-15 17:33:43 Druid

我終於得到了這個工作。如果您將提交按鈕命名爲「提交」，它將不起作用。哎呦。 – 2009-09-15 20:15:16

糟糕！修正了答案！ – Druid 2009-09-15 20:21:33

爲什麼不只是使用鏈接？

您也可以更改每個按鈕的名稱，但我相信鏈接更好，因爲您並未真正提交表單，而只是執行操作。

來源

2009-09-15 17:31:27

我最初使用的是鏈接，但鏈接只能做GET而不是POST。當表單處理是冪等的時候應該使用GET。 – 2009-09-15 17:36:02

非常糟糕的想法：當Google關注鏈接時會發生什麼？一切都被刪除。另外，一些瀏覽器加速器會預取鏈接，所以即使在內聯網的防火牆後面，也有一些風險會自動刪除所有數據。 – NickFitz 2009-09-15 17:43:53

的確，我忘記了Google，但在這種情況下，只需爲每個按鈕創建一個單獨的表單，併爲該行創建一個隱藏字段，然後使用POST操作。 – 2009-09-15 23:17:46

在這種情況下，我不會去與多個提交按鈕。當點擊按鈕時，最好將隱藏的輸入設置爲所需的值（使用Javascript）。然後javascript可以調用myform.submit（）

來源

2009-09-15 17:32:48

使用鏈接，如果你能

<td><a href='delete.php?id=1'>delete</a></td>

如果你堅持要用形式使用這一個

<td> 
    <form action='delete.php'> 
     <input type='hidden' name='id' value='2'> 
     <input type='button' value='delete'> 
    </form> 
</td>

來源

2009-09-15 17:44:40

無關你的問題：圍繞你的屬性值始終把雙引號。

來源

2009-09-15 17:54:26

Internet Explorer 6和7兩者都具有馬車形式處理支持，特別是與button元素：

的innerText一個button元件被提交時，代替value（如果設置）。
所有button元素都是成功的，因此所有的名稱/值對都被提交。這意味着，如果＃1會工作正常，它會刪除所有項目:(
如果type屬性不上button設置，也不會默認爲submit。所以，你必須添加type="submit"每button。

可能的方法來解決這個問題可能是：

1）創建多個form s的包含隱藏字段value：

<form action=".../delete" method="post"> 
    <input type="hidden" name="id" value="1" /> 
    <button type="submit">Delete</button> 
</form> 
<form action=".../delete" method="post"> 
    <input type="hidden" name="id" value="2" /> 
    <button type="submit">Delete</button> 
</form>

2）添加id的button裏面，所以你可以解析它在服務器端：

<button type="submit" value="1">Delete <span>1</span></button>

CSS：

button span { 
    display: none; 
}

C＃：

int id; 
if (!Int32.TryParse(this.Request.Form["delete"], out id) 
{ 
    // Get the value between the `span`s 
}

3）使用JavaScript提交value，而不是innerText並且僅在成功button S：

IE8.js

沒有'最好「的答案，這隻取決於情況。

來源

2009-09-15 18:31:53 Ronald

Personnally，我儘量避免任何JavaScript的這種問題。

感謝Label標籤觸發任何具有ID屬性的表單元素。

<label for="action_delete" class="button-submit"><input type="submit" id="action_delete" name="action" value="delete" /> Delete this item</label>

然後使用CSS樣式的標籤，按鈕

label.button-submit{ cursor: pointer; ... } 
label.button-submit input{ position: absolute; top: -999%; }

乾杯！

來源

2012-10-12 01:12:34

<button>在Firefox和IE中的行爲

回答

相關問題