有如下代码,现在需要写段javascript.
要求当我在listbox1选择一个值的时候,去TABLE里找每行第一个TD里的值和listbox1值相同,并且把符合条件的table里的每一行的第2个TD值加到listbox2(多选listbox)里,请问改怎么实现?????假如我在listbox1中选company1,那么listbox2里应该有12,66这个2个值. <label>
<select name="select"  id="s1">
<option value="请选择" selected="selected" >请选择</option>
<option value="company1">company1</option>
<option value="company2">company2</option>
<option value="company3">company3</option>
</select>
<select name="select2" size="4" multiple id="s2">
<option value="请选择">请选择</option>
</select>
</label>
<table width="130" height="122" border="1" id="tb1">
<tr>
<td width="61">company1</td>
<td width="53">12</td>
</tr>
<tr>
<td>company2</td>
<td>54</td>
</tr>
<tr>
<td>company3</td>
<td>44</td>
</tr>
<tr>
<td width="61">company2</td>
<td width="53">33</td>
</tr>
<tr>
<td>company2</td>
<td>88</td>
</tr>
<tr>
<td>company3</td>
<td>22</td>
</tr>
<tr>
<td width="61">company1</td>
<td width="53">66</td>
</tr>
<tr>
<td>company3</td>
<td>86</td>
</tr>
<tr>
<td>company3</td>
<td>33</td>
</tr>
</table>

解决方案 »

  1.   

    看了原贴,简单改一下就OK!
    <!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=""></HEAD><BODY>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function compareAndInsert(value) {
    var tb1 = document.getElementById("tb1");
    var select2 = document.getElementById("select2");// clear
    select2.options.length = 0;
    var i = 0;
    for(i=0;i<tb1.rows.length;i++) {
    if(tb1.rows[i].cells[0].innerHTML == value) {
    select2.options.add(new Option(tb1.rows[i].cells[1].innerHTML,tb1.rows[i].cells[1].innerHTML));
    }
    }}
    //-->
    </SCRIPT>
    <label>
    <select name="select" onChange="compareAndInsert(this.options[this.selectedIndex].value)">
    <option value="请选择" selected="selected" >请选择</option>
    <option value="company1">company1</option>
    <option value="company2">company2</option>
    <option value="company3">company3</option>
    </select>
    <select name="select2">
    <option value="请选择">请选择</option>
    </select>
    </label>
    <table width="130" height="122" border="1" id="tb1">
    <tr>
    <td width="61">company1</td>
    <td width="53">12</td>
    </tr>
    <tr>
    <td>company2</td>
    <td>54</td>
    </tr>
    <tr>
    <td>company3</td>
    <td>44</td>
    </tr>
    <tr>
    <td width="61">company2</td>
    <td width="53">33</td>
    </tr>
    <tr>
    <td>company2</td>
    <td>88</td>
    </tr>
    <tr>
    <td>company3</td>
    <td>22</td>
    </tr>
    <tr>
    <td width="61">company1</td>
    <td width="53">66</td>
    </tr>
    <tr>
    <td>company3</td>
    <td>86</td>
    </tr>
    <tr>
    <td>company3</td>
    <td>33</td>
    </tr>
    </table>
    <p>&nbsp;</p>
    </BODY>
    </HTML>
      

  2.   

    并不难呀,对于重复项 lz 怎么处理?是否需要删除之?根据现有需求代码如下:<!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>
        <title>Select Game 01</title>
        <meta name="generator" content="editplus" />
        <meta name="author" content="[email protected]" />
        <meta name="keywords" content="javascript" />
        <meta name="description" content="for javascript region of csdn" />
    </head>
    <body>
        <select name="select" id="s1">
            <option value="请选择" selected="selected">请选择</option>
            <option value="company1">company1</option>
            <option value="company2">company2</option>
            <option value="company3">company3</option>
        </select>
        <select name="select2" size="4" multiple id="s2">
            <option value="请选择">请选择</option>
        </select>
        </label>
        <table width="130" height="122" border="1" id="tb1">
            <tr>
                <td width="61">
                    company1</td>
                <td width="53">
                    12</td>
            </tr>
            <tr>
                <td>
                    company2</td>
                <td>
                    54</td>
            </tr>
            <tr>
                <td>
                    company3</td>
                <td>
                    44</td>
            </tr>
            <tr>
                <td width="61">
                    company2</td>
                <td width="53">
                    33</td>
            </tr>
            <tr>
                <td>
                    company2</td>
                <td>
                    88</td>
            </tr>
            <tr>
                <td>
                    company3</td>
                <td>
                    22</td>
            </tr>
            <tr>
                <td width="61">
                    company1</td>
                <td width="53">
                    66</td>
            </tr>
            <tr>
                <td>
                    company3</td>
                <td>
                    86</td>
            </tr>
            <tr>
                <td>
                    company3</td>
                <td>
                    33</td>
            </tr>
        </table>
    </body>
    <script type="text/javascript">
    <!--
    var oSelect1 = document.getElementById("s1");
    var oSelect2 = document.getElementById("s2");
    var oTable1 = document.getElementById("tb1");oSelect1.onchange = function() {
        var selectedValue = this.value;
        var currentRow;
        for (var i=0; i<oTable1.rows.length; i++)
        {
            currentRow = oTable1.rows[i];
            if (currentRow.cells[0].innerText == selectedValue)
            {
                oSelect2.options.add(new Option(currentRow.cells[1].innerText, currentRow.cells[1].innerText));
            }
        }
    };
    //-->
    </script>
    </html>