A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 张甲甲 中级黑马   /  2013-5-30 22:14  /  1177 人查看  /  4 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

本帖最后由 张甲甲 于 2013-6-4 14:21 编辑

看毕老师的视频,学javascript。想做一个按钮 从一个下拉列表 往另一下拉列表添加选项。就是没效果。
好心人帮着看看哈 谢了
代码如下:
<!DOCTYPE html>
<html>
        <head>
                <title>MyHtml.html</title>

                <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
                <meta http-equiv="description" content="this is my page">
                <meta http-equiv="content-type" content="text/html; charset=UTF-8">

                <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

        </head>

        <body>
                This is my HTML page.
                <br>


                <form id="f_1" method="get">
                        <table>
                                <tr>
                                        <td>
                                                <select id="s_1" multiple="multiple" size="10" >
                                                        <option value="1数学1" id="o_1">
                                                                1数学1...
                                                        </option>
                                                        <option value="2数学2" id="o_2">
                                                                2数学2...
                                                        </option>
                                                        <option value="3数学3" id="o_3">
                                                                3数学3...
                                                        </option>
                                                        <option value="4数学4" id="o_4">
                                                                4数学4...
                                                        </option>
                                                        <option value="5数学5" id="o_5">
                                                                5数学5...
                                                        </option>
                                                        <option value="6数学6" id="o_6">
                                                                6数学6...
                                                        </option>
                                                        <option value="7数学7" id="o_7">
                                                                7数学7...
                                                        </option>
                                                        <option value="8数学8" id="o_8">
                                                                8数学8...
                                                        </option>

                                                </select>
                                        </td>
                                        <td>
                                        <input type="button" value="添加" id="b_1"/>
                                       
                                                            
                                        </td>
                                       
                                       
                                        <td>
                                                <select id="s_2" multiple="multiple" size="10">
                                                        <option>
                                                                学科
                                                        </option>

                                                </select>
                                        </td>
                                </tr>
                        </table>

                </form>
<script type="text/javascript">
window.onload=function(){
        
        var s1=document.getElementById("s_1");
        var s2=document.getElementById("s_2");
        var options=document.getElementsByName("o");
        s1.ondblclick=function(){
               
          var option =s1[s1.selectedIndex];
          s2.appendChild(option);

        };
        
        var b1=document.getElementById("b_1");
        function add(){
               
for ( var int = 0; int <s1.length; int++) {
        if(s1[int].selected){
                s2.appendChild(s1[int]);
                int--;
        }
        
}               
};
        
};

</script>

        </body>
</html>


4 个回复

倒序浏览
你没有为添加按钮注册事件啊。
b1.onclick = function(){
         add();
     };
回复 使用道具 举报
<!DOCTYPE html>
<html>
        <head>
                <title>MyHtml.html</title>

                <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
                <meta http-equiv="description" content="this is my page">
                <meta http-equiv="content-type" content="text/html; charset=UTF-8">

                <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

        </head>

        <body>
                This is my HTML page.
                <br>


                <form id="f_1" method="get">
                        <table>
                                <tr>
                                        <td>
                                                <select id="s_1" multiple="multiple" size="10" >
                                                        <option value="1数学1" id="o_1">
                                                                1数学1...
                                                        </option>
                                                        <option value="2数学2" id="o_2">
                                                                2数学2...
                                                        </option>
                                                        <option value="3数学3" id="o_3">
                                                                3数学3...
                                                        </option>
                                                        <option value="4数学4" id="o_4">
                                                                4数学4...
                                                        </option>
                                                        <option value="5数学5" id="o_5">
                                                                5数学5...
                                                        </option>
                                                        <option value="6数学6" id="o_6">
                                                                6数学6...
                                                        </option>
                                                        <option value="7数学7" id="o_7">
                                                                7数学7...
                                                        </option>
                                                        <option value="8数学8" id="o_8">
                                                                8数学8...
                                                        </option>

                                                </select>
                                        </td>
                                        <td>
                                        <input type="button" value="添加" id="b_1"/>
                                       
                                                            
                                        </td>
                                       
                                       
                                        <td>
                                                <select id="s_2" multiple="multiple" size="10">
                                                        <option>
                                                                学科
                                                        </option>

                                                </select>
                                        </td>
                                </tr>
                        </table>

                </form>
<script type="text/javascript">
window.onload=function(){
        
        var s1=document.getElementById("s_1");
        var s2=document.getElementById("s_2");
        var options=document.getElementsByName("o");
        s1.ondblclick=function(){
               
          var option =s1[s1.selectedIndex];
          s2.appendChild(option);

        };
        
        var b1=document.getElementById("b_1");
        b1.onclick = function(){
         add();
     };

        function add(){
               
for ( var int = 0; int <s1.length; int++) {
        if(s1[int].selected){
                s2.appendChild(s1[int]);
                int--;
        }
        
}               
};
        
};

</script>

        </body>
</html>

回复 使用道具 举报
一楼正解,修改代码如上
回复 使用道具 举报
如果问题已经解决,再次编辑,修改主题类型为已解决,方便大家查看
否则继续追问
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马