javascript – 隐藏/显示jquery中的选择框选项？

2019-05-29 19:20:46 阅读：139 来源： 互联网

标签：jquery javascript drop-down-menu html

我在jsp中有以下代码片段

<HTML>
 <BODY>
     <select id="customerIds" onchange="doOperation()">
                <option value="default"> Start..</option>
                  <div id="action1" class="action1">
                    <option value="1"> 1</option>
                    <option value="2"> 2</option>
                    <option value="3"> 3 </option>
                  </div>
                  <div id="action2" class="action2">
                    <option value="4"> 4 </option>
                  </div>
                  <option value="5"> 5 </option>
              </select>
 </BODY>
</HTML>

点击某个按钮,我想隐藏id为“action1”的选项,并将Id选项显示为“action2”.所以我试过这个

  $('#action1').hide();
  $('#action2').show();

但这没有用.没有得到什么问题？当我试图检查选择框时,在firebug中,我没有找到任何div标签(即
使用ids action1 / action2)以上选项.

解决方法:

使用下面的javascript函数,其中showOptionsClass是为每个要显示的选项指定的类.这将
在跨浏览器中工作.

function showHideSelectOptions(showOptionsClass) {
    var optionsSelect = $('#selectId');
    optionsSelect.find('option').map(function() {
        return $(this).parent('span').length == 0 ? this : null;
    }).wrap('<span>').attr('selected', false).hide();

    optionsSelect.find('option.' + showOptionsClass).unwrap().show()
        .first().attr('selected', 'selected');
  }

标签：jquery,javascript,drop-down-menu,html
来源： https://codeday.me/bug/20190529/1180167.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – 隐藏/显示jquery中的选择框选项？