问题描述
我基本上有3个单选按钮和3个文本输入框(见下面的代码):
< input type =radioname =group1id =preloadedvalue =preloaded_imgchecked =checkedonclick = SetVals(); />
< input type =textname =text1id =text1/>
< input type =radioname =group1id =customvalue =custom_imgonclick =SetVals(); />
< input type =textname =text2id =text2/>
< input type =radioname =group1id =vectorvalue =vector_imgonclick =SetVals(); />
< input type =textname =text3id =text3/>
现在,每当我点击一个特定的单选按钮,其他两个按钮的文本输入元素应该得到清除,也变成残疾人(见下面的代码)。
$ b $ pre $ 函数SetVals(){/ /使用JQuery +直JS这个...
$(document).ready(function(){
$(:radio)。click(function(event){
// use event .target来确定单击哪个单选按钮
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) (#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;
}
});
});
$ b $ p
$ b
另外,当页面最初加载时,text2和text3输入字段是通过JavaScript禁用,默认情况下检查text1字段:
document.getElementById(text2)。disabled = true;
document.getElementById(text3)。disabled = true;
我遇到的问题是需要2(2)次点击才能使其工作Firefox浏览器。在Internet Explorer中,它按预期工作。
所以,第一次点击一个单选按钮 - 没有任何反应。再次单击时,即触发Onclick事件。
注意:我为此使用了JQuery,但是也使用了直接的Javascript来取消。
您可以简单地复制代码并粘贴到编辑器中,然后用Firefox打开页面,直接查看问题。
有其他人遇到过吗?这是一些Firefox的错误?如果是这样,是否有解决方法?
任何和所有帮助,意见,建议和输入是受欢迎的。
$ b $因为你正在使用jQuery为单选按钮点击分配事件处理程序,所以你必须使用jQuery可以删除 onClick
属性。
这应该适合您:
$ b $($)$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ 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);
});
Hoping someone has a solution to this weirdness on Firefox 3.
I basically have 3 radio buttons and 3 text input fields (see following code):
<input type="radio" name="group1" id="preloaded" value="preloaded_img" checked="checked" onclick="SetVals();" />
<input type="text" name="text1" id="text1" />
<input type="radio" name="group1" id="custom" value="custom_img" onclick="SetVals();" />
<input type="text" name="text2" id="text2" />
<input type="radio" name="group1" id="vector" value="vector_img" onclick="SetVals();" />
<input type="text" name="text3" id="text3" />
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;
}
});
});
}
document.getElementById("text2").disabled=true;
document.getElementById("text3").disabled=true;
NOTE: I'm using JQuery for this, but have also used straight Javascript to no avail.
Has anybody else encountered this? Is it some sort of Firefox bug? If so, is there a work-around?
Any and all help, comments, suggestions, and input are welcome.
$(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);
});
Side note: since you are using jQuery you might as well use jQuery for almost all dom interactions since mixing the two will eventually lead to some pain. Let jQuery hide the inconsistencies in browsers.
这篇关于单选按钮Onclick事件需要两次点击才能在Firefox上执行/执行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!