Question

我有几个月的清单，现在我想要隐藏从当月（3月/ MAR）开始的所有前几个月。

<ul id="months">
    <li><a class="li-month" data-val="0" href="#JAN">JAN</a></li>
    <li><a class="li-month" data-val="1" href="#FEB">FEB</a></li>
    <li><a class="li-month" data-val="2" href="#MAR">MAR</a></li>
    <li><a class="li-month" data-val="3" href="#APR">APR</a></li>
    <li><a class="li-month" data-val="4" href="#MAY">MAY</a></li>
    <li><a class="li-month" data-val="5" href="#JUN">JUN</a></li>
    <li><a class="li-month" data-val="6" href="#JULY">JULY</a></li>
    <li><a class="li-month" data-val="7" href="#AUG">AUG</a></li>
    <li><a class="li-month" data-val="8" href="#SEP">SEP</a></li>
    <li><a class="li-month" data-val="9" href="#OCT">OCT</a></li>
    <li><a class="li-month" data-val="10" href="#NOV">NOV</a></li>
    <li><a class="li-month" data-val="11" href="#DEC">DEC</a></li>
</ul>

我试过

$(document).ready(function(){
    $('.li-month[href="#'+moment().format("MMM")+'"]').prevUntil().hide();
});

但不幸的是，没有工作，任何想法，请帮助吗？

Answer 1

无需使用循环。请尝试以下方法：

var month = new Date().getMonth();

$('#months').find('[data-val=' + month + ']').parent().prevAll().hide();

看起来更快jsperf

Answer 2

＆＃13;

var d = new Date();

n = d.getMonth();
console.log(n)
$('ul li').each(function() {
console.log($(this).find('a').attr('data-val'))
  if ($(this).find('a').attr('data-val') == n) {

    $(this).prevAll().hide();

  }

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<ul id="months">
  <li><a class="li-month" data-val="0" href="#JAN">JAN</a>
  </li>
  <li><a class="li-month" data-val="1" href="#FEB">FEB</a>
  </li>
  <li><a class="li-month" data-val="2" href="#MAR">MAR</a>
  </li>
  <li><a class="li-month" data-val="3" href="#APR">APR</a>
  </li>
  <li><a class="li-month" data-val="4" href="#MAY">MAY</a>
  </li>
  <li><a class="li-month" data-val="5" href="#JUN">JUN</a>
  </li>
  <li><a class="li-month" data-val="6" href="#JULY">JULY</a>
  </li>
  <li><a class="li-month" data-val="7" href="#AUG">AUG</a>
  </li>
  <li><a class="li-month" data-val="8" href="#SEP">SEP</a>
  </li>
  <li><a class="li-month" data-val="9" href="#OCT">OCT</a>
  </li>
  <li><a class="li-month" data-val="10" href="#NOV">NOV</a>
  </li>
  <li><a class="li-month" data-val="11" href="#DEC">DEC</a>
  </li>
</ul>

＆＃13;

这样做

Answer 3

这是你的任务。你忘记了两件事 - 1）将Mar转换为MAR和2）转到上层获得li plunkr

$(document).ready(function(){
    $('.li-month[href="#'+moment().format("MMM").toUpperCase()+'"]').parent().prevUntil().hide();
});

Answer 4

new Date().getMonth()返回0到11之间的数字。检查data-val attr是否小于当前月份并隐藏父li。

$(document).ready(function() {

  var month = new Date().getMonth();

  $("#months > li > a").each(function() {
    if ($(this).data("val") < month) {
      $(this).parent().hide();
    }
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="months">
  <li><a class="li-month" data-val="0" href="#JAN">JAN</a>
  </li>
  <li><a class="li-month" data-val="1" href="#FEB">FEB</a>
  </li>
  <li><a class="li-month" data-val="2" href="#MAR">MAR</a>
  </li>
  <li><a class="li-month" data-val="3" href="#APR">APR</a>
  </li>
  <li><a class="li-month" data-val="4" href="#MAY">MAY</a>
  </li>
  <li><a class="li-month" data-val="5" href="#JUN">JUN</a>
  </li>
  <li><a class="li-month" data-val="6" href="#JULY">JULY</a>
  </li>
  <li><a class="li-month" data-val="7" href="#AUG">AUG</a>
  </li>
  <li><a class="li-month" data-val="8" href="#SEP">SEP</a>
  </li>
  <li><a class="li-month" data-val="9" href="#OCT">OCT</a>
  </li>
  <li><a class="li-month" data-val="10" href="#NOV">NOV</a>
  </li>
  <li><a class="li-month" data-val="11" href="#DEC">DEC</a>
  </li>
</ul>

Answer 5

使用.parent()和.prevUntil()尝试此操作，如下所示： -

$(document).ready(function(){
    var month = new Date().getMonth();
    $('.li-month[data-val="'+ month +'"]').parent().prevUntil().hide();
});

DEMO

Answer 6

试试这个

＆＃13;

        $(document).ready(function(){
         
    var d = new Date();
    var i=0;
    var n = d.getMonth();

     $('.li-month').hide(); 
          
         for(i =0; i < 13 ; i++){
           if( i > n || i > n ){
               $('[data-val="'+ (i -1) +'"]').show();  
             }
            else
             {
                 $('[data-val="'+ (i -1) +'"]').parent().hide();
              }
          }  
        });

＆＃13;

 

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <ul id="months">
            <li><a class="li-month" data-val="0" href="#JAN">JAN</a></li>
            <li><a class="li-month" data-val="1" href="#FEB">FEB</a></li>
            <li><a class="li-month" data-val="2" href="#MAR">MAR</a></li>
            <li><a class="li-month" data-val="3" href="#APR">APR</a></li>
            <li><a class="li-month" data-val="4" href="#MAY">MAY</a></li>
            <li><a class="li-month" data-val="5" href="#JUN">JUN</a></li>
            <li><a class="li-month" data-val="6" href="#JULY">JULY</a></li>
            <li><a class="li-month" data-val="7" href="#AUG">AUG</a></li>
            <li><a class="li-month" data-val="8" href="#SEP">SEP</a></li>
            <li><a class="li-month" data-val="9" href="#OCT">OCT</a></li>
            <li><a class="li-month" data-val="10" href="#NOV">NOV</a></li>
            <li><a class="li-month" data-val="11" href="#DEC">DEC</a></li>
        </ul>

＆＃13;

Answer 7

<script type="text/javascript">
    $(document).ready(function(){
    var myDate = new Date();
    var curMonth = myDate.getMonth();
    alert(curMonth);
    $('.li-month:lt('+curMonth+')').parent('li').hide();
});
</script>

隐藏所有前几个月从当月开始

7 个答案: