文章/答案/技术大牛

发布

社区首页 >问答首页 >如果对象类不包含值，则jquery隐藏对象

问如果对象类不包含值，则jquery隐藏对象
EN

Stack Overflow用户

提问于 2010-08-31 09:37:35

回答 3查看 1.1K关注 0票数 2

标题可能有点混乱，基本上我正在尝试编写一个脚本，该脚本将从下拉表单中获取所选值，如果其类不包含下拉表单中的值，则隐藏li的。如果这有意义的话？？每个li都有多个类..

这是我到目前为止所得到的(如果它是粗糙的，很抱歉)：

表格：

<form action="" name="filter" id="filter" method="post">
        <select name="bedrooms">
          <option value="">- Select Bedrooms -</option>
          <option value="bed-1">1</option>
          <option value="bed-2">2</option>
          <option value="bed-3">3</option>
          <option value="bed-4">4</option>
          <option value="bed-5">5</option>
        </select>
        <select name="bathrooms">
          <option value="">- Select Bathrooms -</option>
          <option value="bath-1">1</option>
          <option value="bath-2">2</option>
          <option value="bath-3">3</option>
          <option value="bath-4">4</option>
          <option value="bath-5">5</option>
        </select>
        <select name="frontage">
          <option value="">- Select Frontage Size -</option>
          <option value="frontage-100">100</option>
          <option value="frontage-200">200</option>
          <option value="frontage-300">300</option>
          <option value="frontage-400">400</option>
          <option value="frontage-500">500</option>
        </select>
        <input type="submit" name="filter-submit" id="filter-submit" value="Go" />
      </form>

JQuery：

$("#filter-submit").click(function() {

          var foo = [];
          $("#filter :selected").each(function(i, value){
            foo[i] = $(value).val();
          });
          if (foo) {
            $.each(foo, function(index, value){
              if (value) {
                //hide other objects based on "value"
                //$("#portfolio li").hasClass();
            };
            });
          };

        return false;
        });

好的，我的问题是如何隐藏所有没有输出为"value“的类的"#portfolio li”。我想我可以使用hasClass，但不确定如何反转它。如果这有意义?如果有任何帮助，我将不胜感激:)

selected

jquery

class

hide

回答 3

Stack Overflow用户

回答已采纳

发布于 2010-08-31 09:44:03

您可以使用.not()并传递类，如下所示：

$("#filter-submit").click(function() {
  var lis = $("#portfolio li");          //get all of the <li> elements
  $("#filter select").each(function() {  //loop through selected classes
    var val = $(this).val();             //get selected value, could be blank
    if(val) lis = lis.not('.' + val);    //get only <li>s without the class
  });
  lis.hide();                            //hide the ones without all classes
  return false;                          //prevent default behavior
});

票数 2

Stack Overflow用户

发布于 2010-08-31 09:46:08

$("#filter-submit").click(function()
{
    var Portfolio = $("#portfolio");
    $('li',Portfolio).show();

    $("#filter selectb :selected").each(function(i){
        Class = $(this).attr('value');
        $('li',Portfolio).not('.' + Class).get().hide();
    });
    return false;
});

试一试吧！

票数 1

Stack Overflow用户

发布于 2010-08-31 10:24:07

我只是想把这个扔出去找乐子。采用了一种稍微不同的方法来隐藏<li>元素。所有这些都在一个选择器中完成。

$("#filter-submit").click(function() {
    var value = $('#filter select').map(function() {
        return ($(this).val() || null);
    }).get().join( '):not(.' );

    if(value) $('#portfolio li:not(.' + value + ')').hide();// Only filter if at
});                                                         // least one selected

value变量将保存如下所示的字符串：

"bed-1):not(.bath-1):not(.frontage-100"

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/3605478

复制

相似问题

问如果对象类不包含值，则jquery隐藏对象
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果对象类不包含值，则jquery隐藏对象EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果对象类不包含值，则jquery隐藏对象
EN