javascript怎么选中radio

javascript怎么选中radio,第1张

可以按照下面的代码来 *** 作:

<html>

<head>

<script type="text/javascript" src="/jqueryminjs"></script>

</head>

<body>

<div>

<input id="rdo1" name="rdo1" type="radio" value="1" checked="checked"/>是

<input id="rdo1" name="rdo1" type="radio" value="0"/>否

<button id="btn1">是</button>

<button id="btn2">否</button>

<div>

<script type="text/javascript">

$(function(){

$("#btn1")click(function(){

$("input[name='rdo1']")eq(0)attr("checked","checked");

$("input[name='rdo1']")eq(1)removeAttr("checked");

$("input[name='rdo1']")eq(0)click();

});

$("#btn2")click(function(){

$("input[name='rdo1']")eq(0)removeAttr("checked");

$("input[name='rdo1']")eq(1)attr("checked","checked");

$("input[name='rdo1']")eq(1)click();

});

});

</script>

</body>

</html>

写个循环判断哪一个item被选中

if (documentgetElementById("zt")options[i]checked)

documentgetElementById("zt")options[i]value就是2

这样写好些吧:

<form onsubmit="return check(this);" >

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

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

<input type=submit value="提交">

</form>

<script   type="text/javascript">

function   check(formObj)

{

      for(var   i=0;i<formObjalength;i++)

      {         

               if(formObja[i]checked)

               {

               //alert("单选框选中:   "   +   formObja[i]value);

               return   true;

               }

      }   

      alert("单选框未选中");

      return   false;

}   

</script>

radio标签的取值方法如下:

<html:radio   property="userRole"   value="operator"   onclick="radioValue()"/>

<html:radio   property="userRole"   value="admin"   onclick="radioValue()"/>

<script   language="javascript">      

                        function   radioValue(){

                                 var   obj   =   documentalluserRole;

                                 if(obj){

                                       for(var   i=0;i<objlength;i++){//适合length>=2时,当objlength==null时,可以直接取objvalue值

                                             if(obj[i]checked){

                                                   alert(obj[i]value);

                                                   break;

                                             }

                                       }

                                 }         

                        }      

</script>

参考如下:

首先是单选框:

<input type="radio" name="isAuto" value="1"/>是 <input type="radio" name="isAuto" value="0" />否

其次Javascript代码如下:

var isAutoSend = documentgetElementsByName('isAuto');

for (var i = 0; i < isAutoSendlength; i++) {

if (isAutoSend[i]checked == true) {

alert(isAutoSend[i]value);

}

}

整体思路:首先利用JQ分别获取不同name值的radio的选中的值,然后将获取到的值都统一赋给前台某个标签即可。

①:在html文件中,创建radio控件及文本标签;如

<input type="radio" name="radio1" value="1" />

<input type="radio" name="radio1" value="2" />

<br/>

<input type="radio" name="radio2" value="a" />

<input type="radio" name="radio2" value="b" />

<br/>

<input type="text" id="textBox" />

<input type="button" value="确定" class="btn" />

注意,name值一样才能实现radio单选;

②:在Javascript代码中,获取radio选中的值;

var radioVal01 = $("input[name='radio1']:checked")val();

var radioVal02 = $("input[name='radio2']:checked")val();

③:将获取到的值赋给text文本标签

$("btn")click(function(){

var radioVal01 = $("input[name='radio1']:checked")val();

var radioVal02 = $("input[name='radio2']:checked")val();

$("#textBox")val(radioVal01 + "," + radioVal02); //拼接两个选中的值,以逗号隔开

});

<INPUT id="Radio1" type="radio" value="fasd" name="RadioGroup" onclick="alert(thisvalue);">

-------------------------

补充:

你可以试着这样做

当你动态添加控件的时候为每个radio添加一个onclick事件,事件的内容是把自己的value给一个hidden,然后直接点按钮的时候取那个hidden的值就行了。

---------------

再次补充:

是的,不然你就遍历一次就好了,其实客户端遍历是很快的事情,不用考虑效率问题。

1、在电脑上打开软件,新建一个html文件和引入jqueryjs。

2、在html的body里面添加两个单选框radio和一个带有点击事件的按钮,其中两个单选框radio的name需要一致,通过$('input:radio:checked')val()代码获取单选框的值。

3、在浏览器中打开页面,点击获取单选框值按钮,可以看到d出框已经获取勾选的单选框值。

以上就是关于javascript怎么选中radio全部的内容,包括:javascript怎么选中radio、如何通过js获取radio选择状态的值 如下:最终得到的结果就是2。、js获取radio属性的值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/10148097.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-05
下一篇 2023-05-05

发表评论

登录后才能评论

评论列表(0条)

保存