2008-08-08 29 views
10

以下代碼在IE中非常適用,但不適用於FF或Safari。我無法爲我的生活找出原因。代碼是假設禁用單選按鈕,如果您選擇「禁用2單選按鈕」選項。如果您選擇「啓用兩個單選按鈕」選項,它應該啓用單選按鈕。這兩個工作...如何啓用禁用的單選按鈕?

但是,如果您不使用鼠標在2個選項(「啓用...」和「禁用...」)之間移動,那麼單選按鈕看起來不是禁用或正確啓用,直到您單擊頁面上的任何其他位置(而不是單選按鈕本身)。

如果任何人有時間/好奇/感覺有幫助,請將下面的代碼粘貼到html頁面並在瀏覽器中加載。它在IE中很好用,但是問題在FF(我的例子中是3)和Safari中表現出來,全部都在Windows XP上。

<html> 
    <head> 
    <script language="javascript"> 
     function SetLocationOptions() { 
     var frmTemp = document.frm; 
     var selTemp = frmTemp.user; 

     if(selTemp.selectedIndex >= 0) { 
      var myOpt = selTemp.options[selTemp.selectedIndex]; 
      if(myOpt.attributes[0].nodeValue == '1') { 
      frmTemp.transfer_to[0].disabled = true; 
      frmTemp.transfer_to[1].disabled = true; 
      frmTemp.transfer_to[2].checked = true; 
      } else { 
      frmTemp.transfer_to[0].disabled = false; 
      frmTemp.transfer_to[1].disabled = false; 
      } 
     } 
     } 
    </script> 
    </head> 

    <body> 
    <form name="frm" action="coopfunds_transfer_request.asp" method="post"> 
     <select name="user" onchange="javascript: SetLocationOptions()"> 
     <option value="" />Choose One 
     <option value="58" user_is_tsm="0" />Enable both radio buttons 
     <option value="157" user_is_tsm="1" />Disable 2 radio buttons 
     </select> 

     <br /><br /> 

     <input type="radio" name="transfer_to" value="fund_amount1" />Premium&nbsp;&nbsp;&nbsp; 
     <input type="radio" name="transfer_to" value="fund_amount2" />Other&nbsp;&nbsp;&nbsp; 
     <input type="radio" name="transfer_to" value="both" CHECKED />Both 

     <br /><br /> 

     <input type="button" class="buttonStyle" value="Submit Request" /> 
    </form> 
    </body> 
</html> 
+0

嗯,這是工作在IE10和FF:[小提琴](HTTP: //jsfiddle.net/K6cAu/1/) – akinuri 2013-10-08 15:04:38

回答

3

要使FF在使用鍵盤時模仿IE的行爲,可以在選擇框中使用keyup事件。在你的榜樣(我不是附加的事件處理程序這樣的粉絲,但這是另一個話題),這將是這樣的:

<select name="user" id="selUser" onchange="javascript:SetLocationOptions()" onkeyup="javascript:SetLocationOptions()"> 
3

那麼,IE有一個不太標準的對象模型;你在做什麼不應該工作,但你越來越遠離它,因爲IE對你很好。在Firefox和Safari中,代碼中的document.frm評估爲未定義。

您需要在窗體元素上使用ID值,並使用document.getElementById('whatever')來返回對它們的引用,而不是引用文檔對象的不存在的屬性。

所以這工作好一點,可能你在做什麼後:

Line 27: <form name="frm" id="f" ... 

Line 6: var frmTemp = document.getElementById('f'); 

但是,如果你想了解更多關於處理事情以正確的方式你可能想看看這個優秀圖書:DOM Scripting傑里米·基思

而且雖然我們關於這個問題,Bulletproof Ajax由同一作者也值得你的書架上佔有一席之地的是JavaScript: The Good Parts由Doug Crockford的

1

爲什麼不是G rab是AJAX腳本庫中的一個,他們抽象出了很多跨瀏覽器DOM腳本的黑魔法,讓生活變得更加簡單。