当我在select2 Bootstrap中选择一个选项时,如何删除选项

时间:2014-12-04 08:55:31

标签: jquery twitter-bootstrap jquery-select2

我有一个多选的select2字段。用于选择地点。

在此选项中

1.所有地方 2.place1 3.place2 4.place3 5.place4

如果我选择了选项。如果我选​​择第一个选项,则清除所有其他选择的选项。

1 个答案:

答案 0 :(得分:-1)

这是演示代码。

    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;>
        <script language=javascript>
            var subCat=new Array();
            subCat[1]={2:"Computer Book",9:"Grammar Book"};
            subCat[3]={4:"Digital Watch",5:"Analogue Watch"};
            subCat[6]={7:"Android Phone",8:"IPhone"};

            function change_sub_cat(v)
            {
              var cat_id=v.options[v.selectedIndex].value;
              var subCats=subCat[cat_id];
              var subCatDropDown=document.getElementsByName("subCat_id")[0];
              clearDropDown("subCat_id");
              for (subCat_id in subCats)
              {
                option=new Option(subCats[subCat_id],subCat_id);
                subCatDropDown.options[subCatDropDown.options.length]=option;
              }
            }
            function clearDropDown(boxName)
            {
                var x=document.getElementsByName(boxName);
                for (i=0;i<x[0].options.length;i++)
                {
                    x[0].options[i]=null;
                }
                var allOptions=new Option("All",0);
                x[0].options[0]=allOptions;
            }
        </script>
    </head>
    <body style="font-family:arial">
    <h1>Product</h1>
    <form name="choose" method="post" width="100%">
    <table  cellpadding="2" border=0>
        <tr>
            <td align="right">
            Category:
            </td>
            <td align=left>
                <select name="cat_id" onchange="change_sub_cat(this)">
                    <option value=1>Book</option>
                    <option value=3>Watch</option>
                    <option value=6>Mobile phone</option>
                </select>
            </td>
            <td align="right">
            Sub-Category:
            </td>
            <td align=left>
            <select name="subCat_id" size=1>
                <option value=0>All</option>
                <option value=2>Computer Book</option>
                <option value=9>Grammar Book</option>
            </select>
            </td>
            <td>
                <input type="submit" value="Show selection">
            </td>
        </tr>
    </table>   
    </form>
    </body>   
</html>