求助HTML高手radio如何响应失去选中事件

clarck_913 2009-04-24 11:16:11

呵呵~！

我做的东西比较恶心

现在遇到了个问题就是input的radio控件响应事件问题

是这样：一个radio不光要响应被选中的事件，还要监听自己被撤销选中的事件

比如我有个选择题，A，B，C三个选项

用户在页面先选了A，根据某些业务逻辑，选了A以后是要进行一些相关操作的

但是这时候用户想了一下，觉得选A不好，改选B了

那么刚才根据用户选了A这一结果执行的操作，就要实现逆操作

我想设置radio的 onpropertychange事件来实现这个操作，但是发现把JavaScript方法注册到事件上以后

用户点中radio的时候，浏览器调用了2次该方法

而且似乎是在radio的checked属性被设置为true之前调用一次，设置为true之后调用一次

而当选了同组其他radio的时候，这个方法只执行了一次

很郁闷

所以来问问

有没有方法监听radio控件被选中和被撤销的事件啊？

谢谢大家了

...全文

2867 19 打赏收藏转发到动态举报

写回复

用AI写文章

19 条回复

切换为时间正序

请发表友善的回复…

发表回复

u177734357 2012-06-16

打赏
举报

没事别动不东就自动执行 onload什么的

u177734357 2012-06-16

打赏
举报

function getRadio(obj) {
alert(obj.value);
var logon = document.getElementById("logon");
var reg = document.getElementById("reg");

}

<input type="radio" name="logon" id="logon" value="1" checked="checked" onclick="getRadio(this)"/>1
<input type="radio" name="logon" id="logon" value="2" onclick="getRadio(this)"/>
2

jackeyabc 2011-11-10

打赏
举报

asdfadsasdf

eva 2009-10-10

打赏
举报

真恶心

xiaojing7 2009-04-27

打赏
举报

欢迎骚扰

clarck_913 2009-04-27

打赏
举报

恩!

谢谢大家

帖子结了

目前的思路是和xiaojing7的想法一样的

感谢大家的回复,以后有问题,我还会来骚扰大家的

谢谢

lonelyriver 2009-04-26

打赏
举报

路过学习

shenzhenNBA 2009-04-26

打赏
举报

失去选中,也即失去焦点,那么失去焦点的事件可以在对象中这样响应
...onblur="javascript:workFunName(参数);"...

chowyi 2009-04-26

打赏
举报

打酱油

lihan6415151528 2009-04-26

打赏
举报

[Quote=引用 3 楼 hookee 的回复:]
用一个全局变量记住当前选项

HTML code
<html>
<script language="javascript" defer="defer">
var cur;

function check(){
var val;
var rds = document.forms[0].rd;
for(var i=0;i<rds.length;i++){
if(rds[i].checked){
val = i;
break;
}
}
if(val != cur){cur = val; alert("changed")}
}
window.onload=function(){
v…
[/Quote]

正解！

maximus_zhang 2009-04-26

打赏
举报

做了个测试



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

</head>



<body>

<form method="post" action="">

	<input type="radio" name="ask1" id="a1" value="v1" />a1

	<input type="radio" name="ask1" id="a2" value="v2" />a2

	<input type="radio" name="ask1" id="a3" value="v3" />a3

</form>

</body>

<script type="text/javascript">

//<![CDATA[

function a1(){

	alert('a1 ....   do something');

}

function a2(){

	alert('a2 ....  do something');

}

function a3(){

	alert('a3 ....   do something ');

}

function setradio(oname, v, fn){

	var rdos = document.getElementsByName(oname);

	for ( var i=0,L=rdos.length; i<L; i++ ) {

		if ( rdos[i].value==v ) {

			rdos[i].onclick = function(){

				fn();

			};

		}

	}

}



setradio('ask1', 'v1', a1);

setradio('ask1', 'v2', a2);

setradio('ask1', 'v3', a3);

//]]>

</script>

</html>

clarck_913 2009-04-26

打赏
举报

我想的和２楼的思路一样

唉～

做一个调查问卷实在是太难了～

clarck_913 2009-04-26

打赏
举报

[Quote=引用 10 楼 shenzhenNBA 的回复:]
失去选中,也即失去焦点,那么失去焦点的事件可以在对象中这样响应
...onblur="javascript:workFunName(参数);"...
[/Quote]

绝错~

你选Ａ选项以后，再去填一个空

然后回来看这个选择题，改成了选Ｂ，此时，Ａ失去选中，但不会触发失去焦点事件

hookee 2009-04-25

打赏
举报

变量可以动态创建，或用数组，不需要写死。

clarck_913 2009-04-25

打赏
举报

使用临时变量是不行的

因为页面上的选择题的数量，以及选择题和填空题

以及题目之间的跳转关系

比如：单选某一选项要跳转到哪个题
选择题之间选项的组合，选择题与填空题之间的组合

等等都是用户在设计试卷的时候指定的

不是写死在页面上的

caiying2009 2009-04-24

打赏
举报



<div id=radios>

 a <input type=radio name=a value=a >

 b <input type=radio name=a value=b>

 c <input type=radio name=a value=c>

</div>

<script language="javascript">

<!--

var obj=document.getElementById("radios").getElementsByTagName("input")

for (var i=0;i<obj.length;i++){

(function(k){obj[i].onclick=function(){cha(k)}})(i)

}

var lastChecked=null

function cha(k){

if (lastChecked==k)return

if (lastChecked!=null){

	//处理obj[lastChecked]

	alert("上次选中："+lastChecked)

}

lastChecked=k

//处理obj[lastChecked]

alert("本次选中："+lastChecked)

}

//-->

</script>

hookee 2009-04-24

打赏
举报

用一个全局变量记住当前选项



<html> 

<script language="javascript" defer="defer"> 

var cur;



function check(){

	var val;

    var rds = document.forms[0].rd;

    for(var i=0;i<rds.length;i++){

        if(rds[i].checked){

            val = i;

            break;	

        }	

    }

    if(val != cur){cur = val; alert("changed")}

} 

window.onload=function(){

    var rds = document.forms[0].rd;

    for(var i=0;i<rds.length;i++){

        if(rds[i].checked){

            cur = i;

            break;	

        }	

    }

}

</script> 

<body>

<form>

<input type="radio" name="rd" value="0" checked="checked" onclick="check()"> 0<br>

<input type="radio" name="rd" value="1" onclick="check()"> 1<br>

<input type="radio" name="rd" value="2" onclick="check()"> 2<br>

</form>

</body> 

</html>