添加/刪除選項在Firefox中失敗只有

我有一個簡單的網頁，添加&動態刪除選擇元素的選項。該代碼可以正確處理鉻& IE瀏覽器，但在Firefox失敗（當我點擊添加什麼也不會發生&刪除按鈕甚至不露面？）添加/刪除選項在Firefox中失敗只有

你覺得我做錯了嗎？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/homepage.dwt" codeOutsideHTMLIsLocked="false" --> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

    <title></title> 
    <script LANGUAGE="JavaScript" type = "text/javascript"> 
    <!-- 

     function addOption() 
     { 
      var listbox = document.getElementById("listbox"); 
      var lastIndex = listbox.options.length-1; 
      var newOption = document.createElement("option"); 
      newOption.text = "New"; 
      newOption.value = "New"; 

      try 
      { 
       listbox.add(newOption, lastIndex); // standards compliant; doesn't work in IE 
      } 
      catch (ex) 
      { 
       listbox.add(newOption, listbox.selectedIndex); // IE only 
       alert("In addOption(): " + ex); 
      } 

     } 

     function deleteOption() 
     { 
      //alert("1"); 
      var listbox = document.getElementById("listbox"); 
      var lastIndex = listbox.options.length-1; 

      if (lastIndex < 0) 
       return; 

      listbox.remove(lastIndex); 
      //alert("2"); 
     } 
    --> 
    </script> 

    <style type="text/css" media="all"> 
     <!-- 

      div { text-align: center; } 
      button { width: 100px; height: 20px; } 
      #listbox { width: 200px; height: 200px; 

     --> 
    </style> 
</head> 

<body> 

    <div> 
     <select id="listbox" multiple="multiple"> 
      <option>Test</option> 
     </select> 

     <button value="Add" onclick="addOption()"/> 
     <button value="Delete" onclick="deleteOption()"/> 
    </div> 

</body> 
<!-- InstanceEnd --> 
</html>

來源

2011-03-10 Mack

使用：

<button value="Add" onclick="addOption()">Add</button> 
<button value="Delete" onclick="deleteOption()">Delete</button>

代替

<button value="Add" onclick="addOption()"/> 
<button value="Delete" onclick="deleteOption()"/>

按鈕元素需要一個結束標記：http://www.w3.org/TR/html401/interact/forms.html#h-17.5

此外，使用

listbox.options.add(newOption, lastIndex);

代替

listbox.add(newOption, lastIndex);

在這裏看到：http://jsfiddle.net/wEFHA/4/

來源

2011-03-10 21:14:04 quarkdown27

謝謝，非常有幫助:) – Mack 2011-03-10 22:01:06

document.createElement('<option>')工作在IE瀏覽器而不是在FF。
document.createElement('option')正在IE和FF中工作。

來源

2013-12-20 07:07:08

添加/刪除選項在Firefox中失敗只有

回答

相關問題