单选按钮Onclick事件需要两次点击才能在Firefox上触发/执行
希望有人能够解决Firefox 3上的这种奇怪现象。
我基本上有3个单选按钮和3个文本输入字段（参见下面的代码）：
现在，每次我点击一个特定的单选按钮时，其他两个按钮的文本输入元素应该被清除并且也被禁用（参见下面的代码）。
function SetVals() { // using JQuery + straight JS for this... $(document).ready(function() { $(":radio").click(function(event) { // use event.target to determine which radio button was clicked if (event.target.id=="preloaded") { document.getElementByID("text1").disabled=false; $("#text2").val(""); $("#text3").val(""); document.getElementById("text2").disabled=true; document.getElementById("text3").disabled=true; } else if (event.target.id=="custom") { document.getElementByID("text2").disabled=false; $("#text1").val(""); $("#text3").val(""); document.getElementById("text1").disabled=true; document.getElementById("text3").disabled=true; } else if (event.target.id=="vector") { document.getElementByID("text3").disabled=false; $("#text1").val(""); $("#text2").val(""); document.getElementById("text1").disabled=true; document.getElementById("text2").disabled=true; } }); }); }
此外，在最初加载页面时，text2和text3输入字段将通过javascript禁用，因为默认情况下会检查text1字段：
document.getElementById("text2").disabled=true; document.getElementById("text3").disabled=true;
我遇到的问题是它需要2（2）次点击才能使其在Firefox上运行。 在Internet Explorer上，它按预期工作。
因此，第一次点击单选按钮时 – 没有任何反应。 第二次点击时，就是触发Onclick事件的时间。
注意：我正在使用JQuery，但也使用直接的Javascript无济于事。
您只需将我的代码复制并粘贴到编辑器上，然后使用Firefox打开该页面即可直接查看问题。
有没有人遇到过这个？ 这是某种Firefox漏洞吗？ 如果是这样，是否有解决方法？
欢迎任何和所有帮助，意见，建议和意见。
提前致谢！
由于您使用jQuery为单选按钮分配事件处理程序，因此可以删除onClick属性。
这应该适合你：
$(function() { $(":radio").click(function(event) { if (this.id == "preloaded") { $("#text1").removeAttr("disabled"); $("#text2, #text3").val("").attr("disabled", true); } else if (this.id == "custom") { $("#text2").removeAttr("disabled"); $("#text1, #text3").val("").attr("disabled", true); } else if (this.id == "vector") { $("#text3").removeAttr("disabled"); $("#text1, #text2").val("").attr("disabled", true); } }); $("#text2, #text3").val("").attr("disabled", true); });
关于jsfiddle的代码示例。
旁注：由于你使用的是jQuery，你可以使用jQuery几乎所有的dom交互，因为混合两者最终会导致一些痛苦。 让jQuery隐藏浏览器中的不一致性。
你开始使用jQuery，然后返回到vanilla JavaScript ……但你错误地输入了getElementById（）函数。
如果你有它，我会坚持使用jQuery，它也会避免使用这种特殊方法的IE错误。
更清洁的HTML
和jQuery ……
$(document).ready(function(){ //bind the click event to the radio buttons $(':radio').click(function(){ var radioID = $(this).attr('id'); if(radioID == 'preloaded'){ $('#text1').removeAttr('disabled'); $('#text2, #text3').val('').attr('disabled','disabled'); } else if(radioID == 'custom'){ $('#text2').removeAttr('disabled'); $('#text1, #text3').val('').attr('disabled','disabled'); } else if(radioID == 'vector'){ $('#text3').removeAttr('disabled'); $('#text1, #text2').val('').attr('disabled','disabled'); } }); });
您可以尝试.change()事件处理程序。 我认为这可能会更好。
编辑： .change()事件和IE存在问题。