Jqueryが月の初めにliを隠す

私はcssの人ではないので、jqueryが私を少し超えているので、これは本当にシンプルですが、私はそこに行くことはできません。 1ヶ月に1リのULがあります。私はその月に基づいてすべての李を隠す関数を望みます。つまり、私はすべての李が現れる月が一度消えて欲しいので、現在と将来の月だけが残るようにします。Jqueryが月の初めにliを隠す

<script type="text/javascript"> 
$(document).ready(function() { 

var d = new Date(); 
var n = d.getMonth();

のインデックスにn個の比較 - が月額1個のLiはだと、彼らは順番にいるよう

見て、それは私に発生した簡単な方法は、数として現在の月を取得することですそれが小さければそれを隠す。このような何か

var listItem = $("li"); 
alert("Index: " + $("li").index(listItem) ); 

if (n > listItem) { 
$('li).hide(); 
}

しかし、私はそれが各liのために働くことはできません - 私はそれらを配列に格納する必要があると思いますか？

出典

2016-03-22 Guillaume Roberts

タイプミスやバグを？ – Quotidian

'$（" li "）。each（function（idx、item）{item.toggle（idx teran

@teran ooh！あれが好きです。しかし、jQueryオブジェクトにスローする項目が必要です。この文脈における 'item'は単純なノードです。 https://jsfiddle.net/d87pmr1c/ –

私はあなたが求めている正確に何を取得していないが、私は、これはあなたが探しているものであると思います....

私自身の経験では

<ul id="moths"> 
<li>Jan</li> 
...... 
</li>Dec</li> 
</li> 

<script> 
function hideCurrentMonth(selector){ 
    $(selector+' li').eq(new Date().getMonth()).prevAll().hide(); 
} 
</script>

出典

2016-03-22 15:15:02

、リスト項目の値にリレーすることをお勧めしますリストとインデックスの順番ではなく、です。あなたは日付を示して正確にどのようにあなたのリストアイテム投稿していなかったので、私は書いて、（本当にエレガントではない）単純な例あなたはvalで、このチェックを達成し、日付を非表示にすることができます方法を示している：

<body> 
    <ul id="monthsList"> 
     <li>03</li> 
    </ul> 
</body>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

<script> 
var monthsElements = $("#monthsList").children(); 

var currMonth = "03"; // I saw that you already know how to use new Date() to get the current month, im just not sure 
// how you represent your months in the html li's 

for (var i = 0; i < monthsElements.length ; i++) 
{ 
var currMonthLi = monthsElements[i]; 

if ($(currMonthLi).text() == currMonth) 
{ 
    $(currMonthLi).hide(); 
} 

} 
</script>

出典

2016-03-22 15:29:09

申し訳ありませんが、HTMLについて説明している必要があります - 私はちょうどそれらの値を使用することができないので、李の多くのマークアップが含まれています。私はそれらのID、またはデータのインデックス値を割り当てることができます。 –

申し訳ありませんが、私の解決策はうまくいくはずです。テキストの代わりに自分のIDを確認するために "if"を調整すると思います。 –

OK、コメントからの回答。望ましい結果を達成するには多くの方法があります。

$(function(){ 
    var mIdx = new Date().getMonth(); 

    $("ul#months li").each(
      function(idx, item){ 
       $(item).toggle(idx >= mIdx); 
      }); 
}

あなたがliのコレクションを反復処理し、必要な要素を隠し、noneにdsiplayを設定するtoggleを使用するか、またはあなたがそうでremove()要素をすることができ、またはaddClass("hidden")、またはtoggleClass("hidden", ...)とすることができます。..

またはあなたが構築することができます必要なセレクタとhide\remove\toggle要素：

$("li:lt(" + mIdx + ')').hide();

ただし、ページ上に何かを隠す必要がある場合負荷、imho、それはサーバー側では全くレンダリングしない方がいいです。

更新：はdemostrateするコードスニペットを追加しました：

var mIdx = new Date().getMonth(); 
 
$("ul#months li:lt(" + mIdx + ')').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="months"> 
 
    <li>January</li> 
 
    <li>February</li> 
 
    <li>March</li> 
 
    <li>April</li> 
 
    <li>May</li> 
 
    <li>June</li> 
 
    <li>July</li> 
 
    <li>August</li> 
 
    <li>September</li> 
 
    <li>October</li> 
 
    <li>November</li> 
 
    <li>December</li> 
 
</ul>

出典

2016-03-22 15:42:00 teran

これはシンプルですが、感謝します。しかし、私はそれを試してみると、それはすべての李のインデックス値の妥当性を巡って隠す。 –

@GuillaumeRobertsたとえば、コードスニペットを追加しました – teran

Jqueryが月の初めにliを隠す

答えて

関連する問題