javascript - 如果选择选项包含一个条目,jQuery 隐藏下拉框

标签 javascript jquery

如果选择选项仅包含一个条目,我会尝试隐藏下拉框。 (如下所示)在这种情况下我只想隐藏第一个下拉框,而第二个框应保持可见。

<div class="dropdown-filter-div">
<select>
<option value="">Gifts/Offers</option>
</select>
</div>

<div class="dropdown-filter-div">
<select>
<option value="">Gifts/Offers</option>
<option value="Gift">Gift</option>
<option value="Gift">Gift</option>
<option value="Gift">Gift</option>
</select>
</div>

我不知道如何开始它,这就是我想做的..(我在相关页面的不同选项卡中也有两个。

if ($(".dropdown-filter-div > select > option")) contains 1 option {
  $(".dropdown-filter-div > select).hide();
});

编辑

http://mobilereactor.co.uk/shop/mobile-phones/apple-iphone-6s-plus-128gb-rose-gold-deals/移动版本(需要用户代理切换器),带有流行的移动用户代理来查看问题。

当前使用@Kim Gysen

jQuery(document).ready(function($) {
  var $el = $('.dropdown-filter > select > option'); 
  console.log($el.length); 
  if($el.length == 1){
      $el.parent().hide(); 
  }
}); 

在 jq-assets.js 的末尾,但它不起作用。 @金吉森

最佳答案

如果我理解正确的话,如果该选择列表有 1 个或更少的选项,那么您希望从 div 中删除整个选择列表。这就是我为使其发挥作用所做的事情:

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
    <script src="index.js"></script>
</head>
<body>
    <div class="dropdown-filter-div">
        <select>
            <option value="">2</option>
            <option value="">Gifts/Offers</option>
        </select>
    </div>

    <div class="dropdown-filter-div">
        <select>
            <option value="">1</option>
        </select>
    </div>

    <div class="dropdown-filter-div">
        <select>
            <option value="">3</option>
            <option value="">Gifts/Offers</option>
            <option value="">Gifts/Offers</option>
        </select>
    </div>
</body>

$(document).ready(function () {
    var allSelects = $('.dropdown-filter-div > select');

    allSelects.each(function(){
        if(this.length <= 1){
            $(this).hide();
        }
    });
});

我可能让你的答案太过分了,但这只会选择那些小于或等于 1 个选项的选择列表并隐藏它们。

关于javascript - 如果选择选项包含一个条目,jQuery 隐藏下拉框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37619833/

相关文章:

javascript - Electron 自定义关闭、最大化和最大化不起作用

javascript - 如何在循环中使用 jQuery UI 更新变量?

jquery - 如何淡入和淡出div中的所有元素(jquery)

javascript - 当 SectionList/Flatlist 滚动/呈现项目时,UI 线程似乎被阻塞(React Native)

javascript - 使用 JQuery $.GET 和 $.POST

jquery - 带有音频幻灯片的jQuery HTML

javascript - 更改源 URL 时创建图像 CSS 转换

php - AJAX 从 PHP 响应更改 div 内容不起作用

jquery - .hide()、.show()、表格和 IE

javascript - 注入(inject) <SCRIPT> 标签,为其提供正确的位置