【问题标题】:javascript multiple conditions don't workjavascript多个条件不起作用
【发布时间】:2013-03-05 18:26:09
【问题描述】:

我有一个下拉列表,列表中的每个选项都有一年和一个月。 我想根据年份或月份或两者对选择的选项进行排序。 所以我可以显示按年份或月份或年份和月份排序的选项或显示所有内容。 我有以下事件:

     $('#years,#months').bind('change', function () {
         y = $('#years').val();
         m = $('#months').val();
         $('#files > option').each(function () {
             $(this).show();
         });
         $('#files > option').each(function () {
             string = $(this).text();
              //first situation 
             if (y == 'All' && m == 'All')
                $(this).show();
            // second situation 
             else if ((y == 'All') && string.indexOf(m) == -1) 
                    $(this).hide();
            //third situation 
             else if ( string.indexOf(y) == -1 && m == 'All') 
                  $(this).hide();
             // fourth situation 
             else if (string.indexOf(y) == -1 || string.indexOf(m) == -1) 
               $(this).hide();
         });
     });

带有html代码:

<select id='years'>
    <option value='All'>All</option>
    <option value='2013'>2013</option>
    <option value='2012'>2012</option>
</select>
<select id='months'>
    <option value='All'>All</option>
    <option value='Feb'>Feb</option>
    <option value='Jan'>Jan</option>
</select>
<br/>
<br/>
<select id='files' siz='10'>
    <option value='0'>sdgsdfsadfsd1-2013-Feb-1212</option>
    <option value='1'>fsadfadsfadsfadsf2-2012-Feb-123123</option>
    <option value='2'>fsadfadsfadsfadsf3-2012-Jan-123123</option>
    <option value='3'>fsadfadsfadsfadsf4-2013-Jan-123123</option>
    <option value='4'>fsadfadsfadsfadsf5-2012-Feb-123123</option>
    <option value='5'>fsadfadsfadsfadsf6-2013-Feb-123123</option>
    <option value='6'>fsadfadsfadsfadsf7-2013-Feb-123123</option>
    <option value='7'>fsadfadsfadsfadsf8-2013-Jan-123123</option>
    <option value='8'>fsadfadsfadsfadsf9-2012-Jan-123123</option>
    <option value='9'>fsadfadsfadsfadsf10-2013-Feb-123123</option>
    <option value='10'>fsadfadsfadsfadsf11-2012-Feb-123123</option>
</select>

第二种和第三种情况不起作用! 它处理两个条件(true && false),(false && true),因为它们是相同的值!我不知道为什么 ! 这是Demo

【问题讨论】:

  • 请注意,从 jQuery 1.7+ 开始,on 优先于 bind。然后,更好地解释发生了什么(以及在哪里!)。使用console.log(expression) 或alert(exp) 验证条件和调试。
  • 无法理解您最后的评论,您的意思是即使我在触发事件时分配它,它也会保存它的价值

标签: javascript sorting drop-down-menu multiple-conditions


【解决方案1】:

你的逻辑是错误的;最后一个条件不应该被评估。 (例如:如果y == 'All' 和string.indexOf(m) &gt;= 0)。试试这个:

$('#files > option').each(function () {
    var string = $(this).text();
    var show;
    if (y == 'All') {
        show = m == 'All' || string.indexOf(m) >= 0;
    } else if (m == 'All') {
        show = string.indexOf(y) >= 0;
    } else {
        show = string.indexOf(y) >= 0 && string.indexOf(m) >= 0;
    }
    if (show) $(this).show();
    else $(this).hide();
});

【讨论】:

  • 感谢您纠正我的逻辑。你的工作:) 是范围问题吗?你能告诉我怎么解决吗?
  • @Sally - 这只是一个逻辑错误;与范围无关。使用您的代码,如果先前的条件失败,则检查每个条件,但如果年份或月份为'All',您不希望检查最后一个条件。 (他们都是'All'的情况被第一个条件覆盖,但是一个是'All'而另一个是有效的情况满足第四个隐藏条件,因为选项不包含单词'All'。)
猜你喜欢
  • 1970-01-01
  • 2022-01-04
  • 2013-12-31
  • 1970-01-01
  • 2022-10-19
  • 2014-11-29
  • 2012-07-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多