radio框选中如何赋值给多个input？

wyf23256 2011-11-16 02:04:01
如图为需要达到效果：

radio选中后赋值给多个input
找了个代码但是select，而且打开默认input为空，我想做到radio如果设置选中的话，打开后input默认显示radio的取值

以下为参考代码，但不行，劳烦各位给改改看：


<!DOCTYPE html>

<html>

	<head>

		<meta http-equiv="content-type" content="text/html; charset=gb2312" />

		<title> new document </title>

		

	</head>

<body>

	<select id="con_address">

		<option value="a|b|c">选项1</option>

		<option value="1|2|3">选项2</option>

	</select>

	

	<br>

	<input type="text" id="h1">

	<input type="text" id="h2">

	<input type="text" id="h3">

	<script>

		var a = document.getElementById('con_address'),

		    b = [

				document.getElementById('h1'),

				document.getElementById('h2'),

				document.getElementById('h3')

			];



		a.onchange = function(){

			var c = this.value.split('|');

			for(var i=c.length; i--;){

				b[i].value = c[i];

			}

		}

	</script>













</body>

</html>
...全文
477 17 打赏 收藏 转发到动态 举报
写回复
用AI写文章
17 条回复
切换为时间正序
请发表友善的回复…
发表回复
_懒猫 2011-11-17
  • 打赏
  • 举报
 回复
</head>
<body>

<input name="con_address" id="con_address" type="radio" value="a|b|c" onclick="changeTxt(this)" />R选项1
<input name="con_address" id="con_address" type="radio" value="1|2|3" onclick="changeTxt(this)" checked/>R选项2

<br>
页面上的控件ID是唯一的，不能相同
p2227 2011-11-16
  • 打赏
  • 举报
 回复
这个ie也没问题了

<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="content-type" content="text/html; charset=gb2312" />

        <title> new document </title>

        



    <script>

        fillFrom = function(obj){

            var c = obj.value.split('|');

            for(var i=c.length; i--;){

                b[i].value = c[i];

            }

        }    



    </script>

    </head><body>

    <input name="con_address" type="radio" value="a|b|c"/>选项1

    <input name="con_address" type="radio" value="1|2|3" checked/>选项2

    

    <br>

    <input type="text" id="h1">

    <input type="text" id="h2">

    <input type="text" id="h3">

    <script>

        var a = document.getElementsByName('con_address'),

            b = [

                document.getElementById('h1'),

                document.getElementById('h2'),

                document.getElementById('h3')

            ];



        for (var j=0;j<a.length;j++)

        {

            a[j].onclick = function(){

                fillFrom(this);

            }

        }









        window.onload = function(){

            for (var k=0;k<a.length;k++)

            {

                if(a[k].defaultChecked) fillFrom(a[k]);

            }

        }

    </script>













</body>

</html>
p2227 2011-11-16
  • 打赏
  • 举报
 回复
[Quote=引用 14 楼 wyf23256 的回复:]

运行过，打开input框都是空白，选择radio框，input的text框没有值
[/Quote]服了IE。。。。那你再等等看好了，IE下js不好调试，我都是用chrome ff调试的。或者会有其他人解答
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
运行过，打开input框都是空白，选择radio框，input的text框没有值
p2227 2011-11-16
  • 打赏
  • 举报
 回复
#6 的代码你实际运行过了吗
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
贴下代码吧，就差这点就快搞定了
p2227 2011-11-16
  • 打赏
  • 举报
 回复
不能有两个控件的id一样
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
js确实不大行，劳烦兄弟们再帮我看看吧


<!DOCTYPE html>

<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=gb2312" />

        <title> new document </title>

</head>

<body>



<input name="con_address" id="con_address" type="radio" value="a|b|c" onclick="changeTxt(this)" />R选项1

<input name="con_address" id="con_address" type="radio" value="1|2|3" onclick="changeTxt(this)" checked/>R选项2

   

<br>

    <input type="text" id="h1">

    <input type="text" id="h2">

    <input type="text" id="h3">

    <script>

       var  a = document.getElementById('con_address'), 

	   b = [

  document.getElementById('h1'),

  document.getElementById('h2'),

  document.getElementById('h3')

  ];

  window.onload=function(){

  var c = a.value.split('|');

  for(var i=c.length; i--;){

  b[i].value = c[i];

  }

  }



  function changeTxt(obj) {

  var rv = obj.value.split('|');

  for (var i = rv.length; i--; ) {

  b[i].value = rv[i];

  }

    

  }

  //alert(a.value);

</script>

</body>

</html>
p2227 2011-11-16
  • 打赏
  • 举报
 回复
[Quote=引用 8 楼 wyf23256 的回复:]

6楼的直接性的就是错的，赋值没有
fillFrom = function(obj){
不能这么定义吧？？
[/Quote]你还不懂javascript
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
6楼的直接性的就是错的，赋值没有
fillFrom = function(obj){
不能这么定义吧？？
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
按指示改了，但指定一个选中checked的话，input中得text的值总是默认为第一个radio中value值

有什么可以改进的不？
p2227 2011-11-16
  • 打赏
  • 举报
 回复 
<!DOCTYPE html>

<html>

    <head>

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

        <title> new document </title>

        



	<script>

		fillFrom = function(obj){

			var c = obj.value.split('|');

			for(var i=c.length; i--;){

				b[i].value = c[i];

			}

		}	



	</script>

    </head><body>

	<input name="con_address" type="radio" value="a|b|c" checked/>选项1

	<input name="con_address" type="radio" value="1|2|3"/>选项2

    

    <br>

    <input type="text" id="h1">

    <input type="text" id="h2">

    <input type="text" id="h3">

    <script>

        var a = document.getElementsByName('con_address'),

            b = [

                document.getElementById('h1'),

                document.getElementById('h2'),

                document.getElementById('h3')

            ];



		for (j in a)

		{

			a[j].onclick = function(){

				fillFrom(this);

			}

		}









        window.onload = function(){

            for (k in a)

			{

				if(a[k].defaultChecked) fillFrom(a[k]);

			}

        }

    </script>













</body>

</html
yhtapmys 2011-11-16
  • 打赏
  • 举报
 回复
[Quote=引用 4 楼 wyf23256 的回复:]
大家都错了，我给的实例是select

问题是我不要select下拉的

我需要用<input type="radio"
按钮选中赋值给input框
[/Quote]

动手改下不就得了

<input name="radioTag" type="radio" value="a|b|c" onclick="changeTxt(this)"/>R选项1
<input name="radioTag" type="radio" value="1|2|3" onclick="changeTxt(this)"/>R选项2



var b = [
document.getElementById('h1'),
document.getElementById('h2'),
document.getElementById('h3')
];

function changeTxt(obj) {
var rv = obj.value.split('|');
for (var i = rv.length; i--; ) {
b[i].value = rv[i];
}

}
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
大家都错了，我给的实例是select

问题是我不要select下拉的

我需要用<input type="radio"
按钮选中赋值给input框
一起混吧 2011-11-16
  • 打赏
  • 举报
 回复
在你的js代码下面加上下面这段试试：

window.onload=function(){
var c = a.value.split('|');
for(var i=c.length; i--;){
b[i].value = c[i];
}
}
p2227 2011-11-16
  • 打赏
  • 举报
 回复 
<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="content-type" content="text/html; charset=gb2312" />

        <title> new document </title>

        

    </head>

<body>

    <select id="con_address">

        <option value="a|b|c" selected>选项1</option>

        <option value="1|2|3">选项2</option>

    </select>

    

    <br>

    <input type="text" id="h1">

    <input type="text" id="h2">

    <input type="text" id="h3">

    <script>

        var a = document.getElementById('con_address'),

            b = [

                document.getElementById('h1'),

                document.getElementById('h2'),

                document.getElementById('h3')

            ];



        a.onchange = function(){

            var c = this.value.split('|');

            for(var i=c.length; i--;){

                b[i].value = c[i];

            }

        };





		window.onload = function(){

			var c = a.options[a.selectedIndex].value.split('|');

            for(var i=c.length; i--;){

                b[i].value = c[i];

            }

		}

    </script>













</body>

</html>
wyf23256 2011-11-16
  • 打赏
  • 举报
 回复
都帮我看下，分不多，下次私下补上
input-radio(单选框)值的获取/默认选中等操作
input-radio(单选框)值的获取/默认选中等操作 由于每一个单选框均为一个单独的input，无法用id直接获取。可通过将一组radio配置为同一个class下，统一管理。 通过class获取input框的选中值： $("input[name='addusersex']:checked").val() radio的常用方法： 1.获取选中值，三种方法都可以： $('input:radio:checked').val()； $("input[type='radio']:checked").val();
为什么明明是radio单选框，却可以同时选中多个？
为什么明明是radio单选框，却可以同时选中多个？ 原因是：input框中type为radio类型的单选框是否是同一组的判断依据为否拥有同一个name属性值。 详情可以看下面的例子： <!DOCTYPE html> <html> <head> </head> <body> 性别：<br/> 男：<input type="radio" value="男"/><br/> 女：<input type="ra
jquery 给input type=radio 的属性赋值
$("input:radio[name='initialLoad'][value='"+data.data.initialLoad+"']").attr("checked",true); 这样写完了，我以前也这样写没有问题。现在出现了这么个情况： 第一次赋值没有问题，第二次就错了，一直赋值的是默认选中的情况。 我里边有默认值： checked="checked" 这种写法，或者直接属性...
input radio 选中css样式,input radio和checkbox的样式美化
做项目的时候我们常常需要使用单选按钮input[type=radio]和多选框input[type=checkbox]，但是默认的样式肯定与UI设计不一致,而且不够美观，这个时候就需要修改默认的样式，方法其实有蛮多，最先想到的是图片，但是有些时候，图片作为背景图片使用，在手机端适配效果不太理想，所以利用css3的重新实现了一遍，注意，因为使用到伪类属性，故在ie8下无效。原理利用label标签与对...
python input函数赋值法_radio赋值法
一般都会使用attr来使选中：$("#DIV的ID input[name='radio的name'][value="'+动态传的radio的value值+'"]").attr('checked','true')来设置哪个值的radio被选中，但是这种方法试过了没有用，找到一种有效的方法，就是把attr改成prop$("#DIV的ID input[name='radio的name'][value="...
JavaScript

87,915

社区成员

224,619

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章