zoukankan      html  css  js  c++  java
  • select中添加、修改、删除option元素

    <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
    <html>
    <head>
    <title>javascript select options text value</title>
    <meta name="keywords" content="javascript select options text value add modify delete set">
    <meta name="description" content="javascript select options text value add modify delete set">
    <script language="javascript">
    <!--
    // Author: i@lxl.cn
    // Modify: i@cnlei.com
    function watch_ini(){ // 初始
    for(var i=0; i<arguments.length; i++){
      var oOption=new Option(arguments[i],arguments[i]);
      document.getElementById("MySelect").options[i]=oOption;
    }
    }
    function watch_add(f){ // 增加
      var oOption=new Option(f.word.value,f.word.value);
      f.keywords.options[f.keywords.length]=oOption;
    }
    function watch_sel(f){ // 编辑
    f.word.value = f.keywords.options[f.keywords.selectedIndex].text;
    }
    function watch_mod(f){ // 修改
    f.keywords.options[f.keywords.selectedIndex].text = f.word.value;
    }
    function watch_del(f){ // 删除
    f.keywords.options.remove(f.keywords.selectedIndex);
    }
    function watch_set(f){ // 保存
    var set = "";
    for(var i=0; i<f.keywords.length; i++){
    set += f.keywords.options[i].text + ";";
    }
    confirm(set);
    }
    //-->
    </script>
    </head>
    <body>
    <form name="watch" method="post" action="">
    <select id="MySelect" name="keywords" size="10" onchange="watch_sel(this.form)"></select><br>
    <script language="javascript">
    <!--
    watch_ini("我","你","?","他","她","它","尔"); // 初始关键词
    //-->
    </script>
    <input type="text" name="word" /><br />
    <input type="button" value="增加" onclick="watch_add(this.form);" />
    <input type="button" value="修改" onclick="watch_mod(this.form);" />
    <input type="button" value="删除" onclick="watch_del(this.form);" />
    <input type="button" value="保存" onclick="watch_set(this.form);" />
    </form>
    </body>
    </html>
  • 相关阅读:
    梅小雨20191010-2 每周例行报告
    梅小雨20190919-1 每周例行报告
    梅小雨20190919-4 单元测试,结对
    王可非 20191128-1 总结
    20191121-1 每周例行报告
    20191114-1 每周例行报告
    对“都是为了生活”小组成员帮助的感谢
    20191107-1 每周例行报告
    20191031-1 每周例行报告
    20191024-1 每周例行报告
  • 原文地址:https://www.cnblogs.com/goody9807/p/949946.html
Copyright © 2011-2022 走看看