47 javascript radiobuttonlist onclick
如何使用javascript调用radiobutton列表上的onclick？
Mic*_*ren 38
你是如何生成单选按钮列表的？如果你只是使用HTML:
<input type="radio" onclick="alert('hello');"/>
如果您通过ASP.NET之类的东西生成这些内容,则可以将其作为属性添加到列表中的每个元素.填充列表后可以运行此命令,或者如果逐个构建列表,则可以内联它:
foreach(ListItem RadioButton in RadioButtons){
RadioButton.Attributes.Add("onclick", "alert('hello');");
}
更多信息:http://www.w3schools.com/jsref/event_onclick.asp
Vit*_*nko 22
要在单选按钮上触发onClick事件,请调用click()DOM元素上的方法:
document.getElementById("radioButton").click()
使用jquery:
$("#radioButton").click()
AngularJs:
angular.element('#radioButton').trigger('click')
Tom*_*Tom 15
我同意@annakata这个问题需要更多的澄清,但这是一个非常非常基本的例子,说明如何onclick为单选按钮设置事件处理程序:
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var ex1 = document.getElementById('example1');
var ex2 = document.getElementById('example2');
var ex3 = document.getElementById('example3');
ex1.onclick = handler;
ex2.onclick = handler;
ex3.onclick = handler;
}
function handler() {
alert('clicked');
}
</script>
</head>
<body>
<input type="radio" name="example1" id="example1" value="Example 1" />
<label for="example1">Example 1</label>
<input type="radio" name="example2" id="example2" value="Example 2" />
<label for="example1">Example 2</label>
<input type="radio" name="example3" id="example3" value="Example 3" />
<label for="example1">Example 3</label>
</body>
</html>
这里的问题是,RadioButtonList的呈现将各个单选按钮(ListItems)包装在span标记中,甚至当您使用Attributes直接将列表项分配给客户端事件处理程序时,它会将事件分配给span.将事件分配给RadioButtonList会将其分配给它所呈现的表.
这里的技巧是在aspx页面上添加ListItems而不是后面的代码.然后,您可以将JavaScript函数分配给onClick属性.这篇博客文章; Juri Strumpflohner将客户端事件处理程序附加到单选按钮列表中解释了这一切.
这只有在您事先知道ListItems并且无法帮助使用后面的代码动态添加RadioButtonList中的项目时才有效.
小智 5
我认为以上所有方法都可能有效。如果您需要的很简单，我使用：
function checkRadio(name) {
if (name == "one") {
console.log("Choice: ", name);
document.getElementById("one-variable-equations").checked = true;
document.getElementById("multiple-variable-equations").checked = false;
} else if (name == "multiple") {
console.log("Choice: ", name);
document.getElementById("multiple-variable-equations").checked = true;
document.getElementById("one-variable-equations").checked = false;
}
}<div class="radio-buttons-choice" id="container-3-radio-buttons-choice">
<input type="radio" name="one" id="one-variable-equations" onclick="checkRadio(name)"><label>Only one</label><br>
<input type="radio" name="multiple" id="multiple-variable-equations" onclick="checkRadio(name)"><label>I have multiple</label>
</div>