为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
程序员文章站
2023-12-10 08:14:34
下面的例子将展示其结果是没有重载显示提交。 当用户选择一个选项上面,一个函数叫做“getvote()”执行。该功能所引发的“的onclick”事件复制代码 代码如下: <...
下面的例子将展示其结果是没有重载显示提交。
当用户选择一个选项上面,一个函数叫做“getvote()”执行。该功能所引发的“的onclick”事件
<html>
<head>
<script type="text/javascript">
function getvote(int)
{
if (window.xmlhttprequest)
{// code for ie7+, firefox, chrome, opera, safari
xmlhttp=new xmlhttprequest();
}
else
{// code for ie6, ie5
xmlhttp=new activexobject("microsoft.xmlhttp");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readystate==4 && xmlhttp.status==200)
{
document.getelementbyid("poll").innerhtml=xmlhttp.responsetext;
}
}
xmlhttp.open("get","poll_vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="poll">
<h3>do you like php and ajax so far?</h3>
<form>
yes:
<input type="radio" name="vote"value="0" onclick="getvote(this.value)" />
<br />no:
<input type="radio" name="vote"value="1" onclick="getvote(this.value)" />
</form>
</div>
</body>
</html>
the getvote() function does the following:
create an xmlhttprequest object
create the function to be executed when the server response is ready
send the request off to a file on the server
notice that a parameter (vote) is added to the url (with the value of the yes or no option)
判断控件的disabled属性是不是true,是的话return false;实现禁用radio的onclick事件并可再次启用它
方法一:(同时实现禁用,重新启用功能,只能针对button text类型的input,对div无法禁用其onclick事件)
<input type="button" value="a button. click me to see the alert box." onclick="alert('i am clicked.');" id="cmd1" />
<br/>
<input type="button" value="click me to disable the first button" onclick="document.getelementbyid('cmd1').disabled=true;" />
<br/>
方法二,三:(实现移除radio的onclick事件,需再次重新注册事件,可以禁用div的onclick事件)
<input type="button" value="click me to disable the onclick event on first button" onclick="document.getelementbyid('cmd1').onclick=function(){};" />
<br/>
三:
<input type="button" value="click me to disable the onclick event on first button" onclick="document.getelementbyid('cmd1').onclick=null;" />
当用户选择一个选项上面,一个函数叫做“getvote()”执行。该功能所引发的“的onclick”事件
复制代码 代码如下:
<html>
<head>
<script type="text/javascript">
function getvote(int)
{
if (window.xmlhttprequest)
{// code for ie7+, firefox, chrome, opera, safari
xmlhttp=new xmlhttprequest();
}
else
{// code for ie6, ie5
xmlhttp=new activexobject("microsoft.xmlhttp");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readystate==4 && xmlhttp.status==200)
{
document.getelementbyid("poll").innerhtml=xmlhttp.responsetext;
}
}
xmlhttp.open("get","poll_vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="poll">
<h3>do you like php and ajax so far?</h3>
<form>
yes:
<input type="radio" name="vote"value="0" onclick="getvote(this.value)" />
<br />no:
<input type="radio" name="vote"value="1" onclick="getvote(this.value)" />
</form>
</div>
</body>
</html>
the getvote() function does the following:
create an xmlhttprequest object
create the function to be executed when the server response is ready
send the request off to a file on the server
notice that a parameter (vote) is added to the url (with the value of the yes or no option)
判断控件的disabled属性是不是true,是的话return false;实现禁用radio的onclick事件并可再次启用它
方法一:(同时实现禁用,重新启用功能,只能针对button text类型的input,对div无法禁用其onclick事件)
<input type="button" value="a button. click me to see the alert box." onclick="alert('i am clicked.');" id="cmd1" />
<br/>
<input type="button" value="click me to disable the first button" onclick="document.getelementbyid('cmd1').disabled=true;" />
<br/>
方法二,三:(实现移除radio的onclick事件,需再次重新注册事件,可以禁用div的onclick事件)
<input type="button" value="click me to disable the onclick event on first button" onclick="document.getelementbyid('cmd1').onclick=function(){};" />
<br/>
三:
<input type="button" value="click me to disable the onclick event on first button" onclick="document.getelementbyid('cmd1').onclick=null;" />