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

如图为需要达到效果：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>

解决方案 »

  1.   

    <!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>
      

  2.   

    在你的js代码下面加上下面这段试试：    window.onload=function(){
                var c = a.value.split('|');
                for(var i=c.length; i--;){
                    b[i].value = c[i];
                }
        }
      

  3.   

    大家都错了，我给的实例是select问题是我不要select下拉的我需要用<input type="radio"
    按钮选中赋值给input框
      

  4.   


    动手改下不就得了<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];
                }
                
            }
      

  5.   

    <!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
      

  6.   

    按指示改了，但指定一个选中checked的话，input中得text的值总是默认为第一个radio中value值有什么可以改进的不？
      

  7.   

    6楼的直接性的就是错的，赋值没有
    fillFrom = function(obj){
    不能这么定义吧？？
      

  8.   

    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>
      

  9.   

    运行过，打开input框都是空白，选择radio框，input的text框没有值
      

  10.   

    服了IE。那你再等等看好了，IE下js不好调试，我都是用chrome ff调试的。或者会有其他人解答
      

  11.   

    这个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>
      

  12.   

    </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是唯一的，不能相同