Javascript功能在Chrome中不能正常工作

我是否可以使用js來改變div顏色取決於輸入點擊或選擇它在Firefox上的完美工作，但無線電輸入無法看到onblure屬性，因此它永遠不會返回div到其靜態顏色當點擊任何地方
這裏的功能Javascript功能在Chrome中不能正常工作

<script type="text/javascript"> 


    function highlight(element) { 
     element.parentNode.style.backgroundColor = '#84DFC1'; 
    } 

    function removeHighlight(element) { 
     element.parentNode.style.backgroundColor = ''; 
    } 
</script>

，這裏的無線輸入

<div class="form-item"> 
<label>Gender:</label> 
<input id="male-radio" type="radio" name="radio"value="male" class="radio-form" onselect="highlight(this);" onchange="highlight(this);" onfocus="highlight(this);" onblur="removeHighlight(this);"></input> 
<label id="male-label">Male</label> 
    <input id="female-radio" type="radio" name="radio" class="radio-form" value="female" onselect="highlight(this);" onchange="highlight(this);" onfocus="highlight(this);" onblur="removeHighlight(this);"></input> 
     <label class="radioform-label">Female</label> 
    </div>

來源

2011-05-24 alyelgarhy

看到它運行在這裏：http://jsfiddle.net/YmNm9/ - 在Chrome中適合我。（請記住，Chrome的選擇模式與Firefox的選擇模式有所不同 - 我認爲它的目標是「更好」，但我覺得它有點麻煩 - 例如點擊鏈接不會改變控制焦點，只有選項卡會做到這一點。） – 2011-05-24 11:40:06

試試這個（在IE9測試，FF4）：

<script type="text/javascript"> 
    function highlight(element) 
    { 
     element.parentNode.style.backgroundColor = '#84DFC1'; 
    } 
    function removeHighlight(element) 
    { 
     element.parentNode.style.backgroundColor = ''; 
    } 
</script> 

<div class="form-item"> 
    <label> 
     Gender:</label><input id="male-radio" type="radio" name="radio" value="male" class="radio-form" onclick="highlight(this);" onblur="removeHighlight(this);"></input> 
    <label id="male-label"> 
     Male</label> 
    <input id="female-radio" type="radio" name="radio" class="radio-form" value="female" onselect="highlight(this);" onclick="highlight(this);" onblur="removeHighlight(this);"></input> 
    <label class="radioform-label"> 
     Female</label> 
</div>

這不適用於Safari或Chrome。根據W3C的說法，onblur不是單選按鈕的有效事件。

您也可以刪除計時器上的高亮顯示。見下文。這將適用於所有瀏覽器。

<html> 
<head> 
    <script type="text/javascript"> 
     function highlight(element) 
     { 
      element.parentNode.style.backgroundColor = '#84DFC1'; 

      //Remove highlight in 3 seconds 
      setTimeout("document.getElementById('" + element.id + "').parentNode.style.backgroundColor = ''", 3000); 
     } 
    </script> 
</head> 
<body> 
    <div class="form-item"> 
     <label> 
      Gender:</label><input id="male-radio" type="radio" name="radio" value="male" class="radio-form" onclick="highlight(this);"></input> 
     <label id="male-label"> 
      Male</label> 
     <input id="female-radio" type="radio" name="radio" class="radio-form" value="female" onselect="highlight(this);" onclick="highlight(this);"></input> 
     <label class="radioform-label"> 
      Female</label> 
    </div> 
</body> 
</html>

來源

2011-05-24 11:40:01

Safari和鉻（即，WebKit瀏覽器）不火「焦點」，並且響應於對單選按鈕，複選框，按鈕和鼠標操作「模糊」的事件。 Here是PPK關於這個主題的Quirksmode頁面。然而，當他們使用鍵盤來瀏覽表單時，它們會發生火災事件做。

來源

2011-05-24 11:40:13 Pointy

Javascript功能在Chrome中不能正常工作

回答

相關問題