这样的一个function应该怎么写，怎么写，怎么写……

在form1中有个table,table中有一列是checkbox，还有一列是select.
form2中有一个select,一个button。
现在要实现的功能是，单击button，使form1中checkbox选中的行的select的选中值变为form2中select的选中值。

解决方案 »

  1.   

    <!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>
    <script type="text/javascript">
    function changeSEL() {
    var chk = document.getElementById('form1').getElementsByTagName('input')[0];
    if (chk.checked == true) {
    var s = document.getElementById('form2').getElementsByTagName('select')[0].getElementsByTagName('option');
    for (var i = 0; i < s.length; i ++) {
    if (s[i].value == chk.parentNode.parentNode.getElementsByTagName('select')[0].value) {
    s[i].selected = true;
    break;
    }
    }
    }
    }
    </script>
    </head><body>
    <form name="form1" id="form1">
    <table>
    <tr>
    <td><input type="checkbox" /></td>
    <td>
    <select>
    <option value="1">1</option>
    <option value="2">2</option>
    </select>
    </td>
    </tr>
    </table>
    </form>
    <form name="form2" id="form2">
    <select>
    <option value="default">default</option>
    <option value="1">1</option>
    <option value="2">2</option>
    </select>
    <br />
    <input type="button" onclick="changeSEL()" value="点我" />
    </form>
    </body>
    </html>
      

  2.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
      <script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
      <script type="text/javascript">
    $(function(){
    $("#btn").click(function(){
    $("#sel").empty();
    $("#f1 tr").each(function(){
    if($(this).find(":checkbox").attr("checked")){
    $("#sel").append($(this).find("option").clone());
    }
    })
    })
    })
      </script>
     </HEAD> <BODY>
      <form name="form1" id="f1"> 
    <table>
    <tr>
    <td>
    <input type="checkbox"/>
    </td>
    <td>
    <select>
    <option>AAAAAAAAAA</option>
    <option>BBBBBBBBBB</option>
    <option>CCCCCCCCCC</option>
    </select>
    </td>
    </tr>
    </tr>
    <td>
    <input type="checkbox"/>
    </td>
    <td>
    <select>
    <option>DDDDDDDDDD</option>
    <option>SSSSSSSSSS</option>
    <option>QQQQQQQQQQ</option>
    </select>
    </td>
    </tr>
    </tr>
    <td>
    <input type="checkbox"/>
    </td>
    <td>
    <select>
    <option>EEEEEEEEEE</option>
    <option>FFFFFFFFFF</option>
    <option>XXXXXXXXXX</option>
    </select>
    </td>
    </tr>
    </table>
      </form>
      <form name="form1" id="f2"> 
    <table style="width:200px;">
    <tr>
    <td>
    <input type="button" value="ClickME" id="btn" onclick=""/>
    </td>
    </tr>
    <tr>
    <td>
    <select id="sel">

    </select>
    </td>
    </tr>
    </table>
      </form>
     </BODY>
    </HTML>
      

  3.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <script>
    function $(id){return document.getElementById(id)}
    function test(){
      var chk=document.getElementsByName("chk")
      for(var i=0;i<chk.length;i++){
        if(chk[i].checked){  chk[i].value=$("s3").value }
      }  
    }
    </script>
    </head>
    <body>
    <form id=frm1>
    <table>
    <tr>
    <td>1</td>
    <td><input type=checkbox id=chk1 name=chk value='abc'/></td>
    <td>
    <select id=s1 name=s1>
    <option value=1>111</option>
    <option value=2>222</option>
    </select>
    </td>
    <tr>
    <tr>
    <td>2</td>
    <td><input type=checkbox id=chk1 name=chk value='def' /></td>
    <td>
    <select id=s2 name=s1>
    <option value=1>111</option>
    <option value=2>222</option>
    </select>
    </td>
    <tr>
    </table>
    </form>
    <hr>
    <form id=frm1>
    <select id=s3 name=s2>
    <option value=555>5555555555</option>
    <option value=666>6666666666</option>
    </select> <br>
    <input type=button id=b1 name=b1 value=test onclick="test()" />
    </form>
    </body>
    </html>
      

  4.   

    1楼的代码可以实现，但是正好写反了，应该是根据form2中的select设置form1中的select，我改了下我的代码怎么就是不能实现呢。
    2楼的代码……可能是我没有表达清楚意思。
    3楼的代码无效。这是UI
    http://hi.baidu.com/%C9%EE%B3%C1%B5%C4%B7%B1%BB%AA/album/item/aa77bed45ab528609a5027ee.html
    其实就是实现一个批处理功能。
    下面是我的代码function setDate() {
    var sy1,sy2,sm1,sm2,sd1,sd2;
    var chbx = document.f_main.chkState;
    var radios = document.setForm.radio;
    var year1 = document.f_main.yearFrom;
    var month1 = document.f_main.monthFrom;
    var day1 = document.f_main.dayFrom;
    var year2 = document.f_main.yearTo;
    var month2 = document.f_main.monthTo;
    var day2 = document.f_main.dayTo;
        for(var i=0;i<chbx.length;i++) {
         if (chbx[i].checked == true) {
             if(radios[0].checked == true){
             sy1 = year1[j].getElementsByTagName('option');
         for(var j=0;j<sy1.length;j++){
    if(sy1[j].value == document.setForm.year.value){
    sy1[j].selected = true;
    }
         }
         sm1 = month1[j].getElementsByTagName('option');
         for(var j=0;j<sm1.length;j++){
    if(sm1[j].value == document.setForm.month.value){
    sm1[j].selected = true;
    }
         }
    sd1 = day1[j].getElementsByTagName('option');
    for(var j=0;j<sd1.length;j++){
    if(sd1[j].value == document.setForm.day.value){
    sd1[j].selected = true;
    }
         }
         } else {
         sy2 = year2[j].getElementsByTagName('option');
         for(var j=0;j<sy2.length;j++){
    if(sy2[j].value == document.setForm.year.value){
    sy2[j].selected = true;
    }
         }
         sm2 = month2[j].getElementsByTagName('option');
         for(var j=0;j<sm2.length;j++){
    if(sm2[j].value == document.setForm.month.value){
    sm2[j].selected = true;
    }
         }
    sd2 = day2[j].getElementsByTagName('option');
    for(var j=0;j<sd2.length;j++){
    if(sd2[j].value == document.setForm.day.value){
    sd2[j].selected = true;
    }
         }
         }
            }
        }
    }
    <td class="item_label">一括設定</td>
    <td class="item_object">
    <div><input type="radio" value="in" checked name="radio" />入部</div>
    <div><input type="radio" value="out" name="radio" />退部</div>
    </td>
    <td class="item_object">
    <sbocustom:nendo name="year" year="<%=SESSION_BEAN.getSystemNendo()%>" blank="true" />年
    </td>
    <td>
    <sbocustom:monthtag name="month" blank="true" />月
    </td>
    <td>
    <sbocustom:daytag name="day" blank="true" />日
    </td>
    <td>
    <input type="button" value="一括設定" onClick="setDate()" />&nbsp;&nbsp;&nbsp;&nbsp;
    </td>
    </td>
    <td align="left">
    <sbocustom:nendo name="yearFrom" year="<%=SESSION_BEAN.getSystemNendo()%>" blank="true" />年
    <sbocustom:monthtag name="monthFrom" blank="true" />月
    <sbocustom:daytag name="dayFrom" blank="true" />日
    </td>
    <td align="left">
    <sbocustom:nendo name="yearTo" year="<%=SESSION_BEAN.getSystemNendo()%>" blank="true" />年
    <sbocustom:monthtag name="monthTo" blank="true" />月
    <sbocustom:daytag name="dayTo" blank="true" />日
    </td>
      

  5.   

    哦，原来是这个需求。。稍微改一下就可以了，你实际应用中的表单有好几个select控件，自己写个函数修改一下就可以了：
    <!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>
    <script type="text/javascript">
    function changeSEL() {
    var val = document.getElementById('form2').getElementsByTagName('select')[0].value;
    var chks = document.getElementById('form1').getElementsByTagName('input');
    for (var i = 0; i < chks.length; i ++) {
    if (chks[i].checked == true) {
    var s = chks[i].parentNode.parentNode.getElementsByTagName('select')[0].getElementsByTagName('option');
    //查找checkbox控件所在行的select对象的方法是在checkbox的爷爷节点（父节点的父节点）中查找select标签
    for (var j = 0; j < s.length; j ++) {
    if (s[j].value == val) {
    s[j].selected = true;
    break;
    }
    }
    }
    }
    }
    </script>
    </head><body>
    <form name="form1" id="form1">
        <table>
            <tr>
                <td><input type="checkbox" /></td>
                <td>
                    <select>
                        <option value="1">1</option>
                        <option value="2">2</option>
                    </select>
                </td>
            </tr>
        </table>
    </form>
    <form name="form2" id="form2">
        <select>
            <option value="default">default</option>
            <option value="1">1</option>
            <option value="2">2</option>
        </select>
        <br />
        <input type="button" onclick="changeSEL()" value="点我" />
    </form>
    </body>
    </html>
      

  6.   


    <!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>
        <script src="jquery-1.4.4.js" type="text/javascript"></script>
        <script type="text/javascript">
            function changeSEL() {
                if($("#chk1").is(":checked"))
                    $("#sel1").val($("#sel2").val());
            } 
         </script>
    </head>
    <body>
        <p>
        在form1中有个table,table中有一列是checkbox，还有一列是select.
    form2中有一个select,一个button。
    现在要实现的功能是，单击button，使form1中checkbox选中的行的select的选中值变为form2中select的选中值。
        </p>
        <form name="form1" id="form1">
        <p>form1</p>
        <table>
            <tr>
                <td>
                    <input id="chk1" checked="checked" type="checkbox" />
                </td>
                <td>
                    <select id="sel1">
                        <option value="1">1</option>
                        <option value="2">2</option>
                    </select>
                </td>
            </tr>
        </table>
        </form>
        <hr />
        <form name="form2" id="form2">
        <p>form2</p>
        <select id="sel2">
            <option value="default">default</option>
            <option value="1">1</option>
            <option value="2">2</option>
        </select>
        <br />
        <input type="button" onclick="changeSEL()" value="点我" />
        </form>
    </body>
    </html>