在js中怎么设置radio的值

在js中怎么设置radio的值,第1张

取值:var addressVal = $("input[name='address']:checked").val()

指定单选值:$("input[name='radioName'][value=2]").attr("checked",true)

首先要明确下面几点:

1、动态添加的radio必须有name属性,同一组的radio其name属性一定相同(所谓同一组就是说多个radio中只有一个被选中,其他自动恢复为未选中状态);

2、如果要关联label,则radio必须设置id属性,且id必须具有唯一性(不但radio之间的id不能相同,整个页面所有元素的id都不能相同);

3、label的for属性必须与所关联的radio相同。

下面是个已通过测试的例子:

<button id=btn>添加radio</button>

<div id=test></div>

<script>

var id=100

window.onload=function(){

   document.getElementById("btn").onclick=function(){

      var ipt=document.createElement("input")

      ipt.name="r"

      ipt.type="radio"

      ipt.id="r"+id

      document.getElementById("test").appendChild(ipt)

      var lbl=document.createElement("label")

      lbl.setAttribute("for","r"+id)

      lbl.innerHTML="r"+id

      document.getElementById("test").appendChild(lbl)

      id++

   }

}

</script>

如果把radio放到label内,也可以不设置radio的id属性和label的for属性:

<button id=btn>添加radio</button>

<div id=test></div>

<script>

window.onload=function(){

   document.getElementById("btn").onclick=function(){

      var lbl=document.createElement("label")

      lbl.innerHTML="r"+parseInt(Math.random()*1000)

      var ipt=document.createElement("input")

      ipt.name="r"

      ipt.type="radio"

      lbl.appendChild(ipt)

      document.getElementById("test").appendChild(lbl)

   }

}

</script>

看了你的问题,我有几点意见

1、建议你以后创建html元素的时候,name属性和id属性尽量保持一致,除非特殊情况,这个是编码规范

2、写代码的时候尽量写全,比如你的id="times/>(1~10)这里少了一个上引号,如果别人写的代码总是这样马虎,让你改,你要疯掉的

3、按照你的意思是想用一个选择框来控制文本的输入,这里有2种方案的,第一种是用1个checkbox比你上面用2个radio要实用很多,很多时候要考虑合理性和客户体验;如果你想选不同的radio,而要用户做不同的事情,比如选几种情况需要填几种不同的内容就用radiogroup来做

代码如下:

<h3>使用checkbox<h3/>

<div>是否测试:<input type="checkbox" name="test" id="test" checked="checked" /></div>

<div><input type="text" name="times" id="times" /></div>

<div><input type="button" value="提交" onclick="checkdata()"/></div>

<h3>使用radiobox<h3/>

<div>是否测试:<input type="radio" name="A1" id="A1" value="1" checked/>是 <input type="radio" name="A1" id="A1" value="2" />否</div>

<div><input type="text" name="testb" id="testb" /></div>

<div><input type="button" value="提交" onclick="checkradio()"/></div>

<script language="javascript">

<!--

function checkdata() {

if (test.checked &&times.value=="") {

alert("文本框必须输入")

}

}

function checkradio() {

for(i=0i<A1.lengthi++) {

if(A1[i].checked==true &&A1[i].value==1) {

alert("文本框必须输入")

return

}

}

}

//-->

</script>


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

原文地址:https://54852.com/zaji/6366595.html

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

发表评论

登录后才能评论

评论列表(0条)

    保存