javascript - 通过javascript设置时单选按钮onchange不触发

Question

我想要的是当我通过 javascript 设置选中状态时，单选按钮触发 onchange 事件。

http://jsfiddle.net/4gtCn/

<script>
function check()
{
document.getElementById("red").checked=true
}
function uncheck()
{
document.getElementById("red").checked=false
}
function selectionChanged(){
alert("checked");
}
</script>

What color do you prefer?<br>
<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onclick="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green">Green


<button type="button" onclick="check()">Check "Red"</button>
<button type="button" onclick="uncheck()">Uncheck "Red"</button>

感谢大家的帮助。这是一个更大问题的片段。我正在使用第 3 方报告工具 (LogiXml)。我唯一的选择是更改事件，因为其余的 javascript 是由该工具生成的。所以提供的一些选项对我没有帮助。因此，在上面的示例中，当我单击按钮时，单选按钮中的相应事件应该会触发。

Answer 1

这是你想做的吗？

<script>
function check()
{
    document.getElementById("red").checked=true;
    selectionChanged();
}
function uncheck()
{
    document.getElementById("red").checked=false
    selectionChanged();
}
   function selectionChanged(){
   alert("checked");
}
</script>

因此您可以通过单击或按下按钮来输入函数“selectionChanged()”。

Answer 2

JavascriptOnChnage()事件在 IE8 上不起作用，因此最好使用click事件代替更改事件。见：http: //forum.jquery.com/topic/ie8-onchange-onclick-not-firing。

关于 change 事件的另一件有趣的事情是，当您使用 Jquery 的change()功能时，它只有在您单击检查时才会起作用。不是当您单击取消选中。 JQuery $(#radioButton).change(...) 在取消选择期间未触发

Answer 3

当您通过 JS 选中/取消选中时，您可以手动触发事件。像这样...

document.getElementById("red").onchange(); 

警告：请检查与其他浏览器的兼容性，尤其是 IE，否则使用 jQuery 来完成相同的操作。

Answer 4

你也可以这样调用 onClick 方法：

document.getElementById("radioButton").click()

Answer 5

将所有单选按钮的onclick更改为onchange，因为在onchange中的一些单选按钮和onclick中的一些单选按钮

<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onchange="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green" onchange="selectionChanged()">Green

Answer 6

如果你想通过 onChange 事件运行 selectionChanged 函数，当用户点击调用 check() 函数时，你可以直接在 check() 函数上调用 selectionChanged 函数使其运行。

请检查下面的代码，我们在 check() 函数中添加了 selectionChanged()：

<script>
function check()
{
document.getElementById("red").checked=true
selectionChanged();
}
function uncheck()
{
document.getElementById("red").checked=false
}
function selectionChanged(){
alert("checked");
}
</script>

What color do you prefer?<br>
<input type="radio" name="colors" id="red" onchange="selectionChanged()">Red<br>
<input type="radio" name="colors" id="blue" onclick="selectionChanged()">Blue<br>
<input type="radio" name="colors" id="green">Green


<button type="button" onclick="check()">Check "Red"</button>
<button type="button" onclick="uncheck()">Uncheck "Red"</button>

Answer 7

似乎没问题。尝试使用 firebug 进行调试并在 firebug 中检查控制台是否有任何语法错误。