Question

我是编程新手，我想知道如何从我选择的控件中隐藏一些选项...... 我要解释一下：所以，我有两个选择控件..根据选择号1的选项，我想隐藏第二个选项中的一些项目，但我不知道如何做到这一点，我正在尝试使用一些jQuery .hide但它不起作用...希望你能帮助我... 谢谢

Answer 1

试试这个。

 if($("#APU").val("1")) {
    $("#celda option[value = 'raven']").wrap('<span>')
}

要再次显示，只需找到该选项（不是跨度）和

$("#celda option[value = 'raven']").unwrap()

Answer 2

希望这能给你一个想法，因为你没有发布任何代码。

HTML

<select id="selectA">
  <option value="">Select Fruit or Veg</option>
  <option value="fruit">Fruit</option>
  <option value="vegetable">Vegetable</option>
</select>

<select id="selectB">
  <option value="">All</option>
  <option value="apple" data-type="fruit">apple</option>
  <option value="orange" data-type="fruit">orange</option>
  <option value="carrot" data-type="vegetable">carrot</option>
  <option value="tomato" data-type="vegetable">tomato</option>
</select>

JS

var selectA = document.querySelector('#selectA')
var selectB = document.querySelector('#selectB')

selectA.addEventListener('change', event => {
  var type = event.target.value;

  [].slice.call(selectB.querySelectorAll('option'))
    .forEach(el => {
      el.style.display = (el.dataset.type === type ? 'block' : 'none')
    })
})

JSFiddle演示：https://jsfiddle.net/hw76aLqv/1/

Answer 3

我希望这会有所帮助。虽然jQuery函数非常冗长但是这样你就可以获得实际发生的事情了。从第一个选择元素中选择一个选项后，请检查id是否为“selectA”。

将所选选项作为变量OPTIONS中的对象。然后使用.next（）函数转到下一个选择元素。

使用循环将遍历select元素的所有子元素。之后我正在检查。如果子元素的数据类型不等于options.val（）使用.hide（）隐藏子元素

这是代码

  $(document).ready(function(){
$('select').on('change',function(){
    if($(this).attr('id')=='selectFirst'){
        var options = $(this).find('option:selected');
        var nextSelect = $('select').next();

        nextSelect.children().each(function(){
            child  = $(this);
            if(child.attr('data-type') != options.val()){
                child.hide();
            }

        });

    }
});

如何隐藏选择列表中的某些元素？

3 个答案: