2

現時点では、メニューのIDを持つ順序付けられていないリストがあり、このul内の1つのリスト項目には「選択済み」のクラスがあります。私がやりたいことは、ul内からすべてのリスト項目を取得し、最初に選択されたクラスを削除することですページが更新されるたびに、同じ ul 内の別のリスト項目に割り当てます。

これは可能ですか？これを達成するための最良の方法は何ですか？

4

3 に答える 3

2 
$(document).ready(function() {

    var $ulLen = $('#menu li').length;

    $('#menu li').removeClass('selected'); // Remove the class

    // Select random li..

    var rand = Math.floor( (Math.random()* $ulLen ) );  // Select  a random li..

     $('#menu li:eq('+ rand + ')').addClass('selected'); 

     // Add the selected class to randomly selected li...

});

フィドルをチェック

于 2012-10-22T16:03:40.403 に答える
1

これはおそらくもっと短く書くこともできますが、手順を確認できるようにもっと冗長にしたかったのです。技術的には、これは同じものを 2 回選択する可能性があります。必要に応じて、LocalStorage または Cookie を使用して最後のアイテムを記憶し、再度選択しないようにすることもできます。シンプルにいきました。

<!DOCTYPE html> 
<html>
<head>
    <title>Demo</title> 
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script>


    $(document).ready(function() {

        //remove the selected class from the li that has it
        $("li.selected").removeClass("selected");

        //get all the LIs
        var menuItems = $("ul#menu li");
        //How many do we have?
        var numItems = menuItems.length;
        console.log(numItems);
        //Pick one by randm
        var selected = Math.floor(Math.random()*numItems);
        console.log(selected);
        //And set it
        $("ul#menu li:nth-child("+(selected+1)+")").addClass("selected");
    });
    </script>

    <style>
        li.selected { background-color: red; }
    </style>
</head> 

<body> 

<ul id="menu">
    <li>Item one</li>
    <li>Item two</li>
    <li>Item three</li>
    <li class="selected">Item four</li>
    <li>Item five</li>
</ul>

</body>
</html>
于 2012-10-22T16:06:46.257 に答える
1

http://jsfiddle.net/eWbqa/8/

var menu = document.getElementById('menu');
var tags = menu.getElementsByTagName('li');

tags[Math.floor(Math.random() * tags.length)].setAttribute('class', 'selected');

それを拡張することもできますが、それで十分です。

*Naveen の適切なアドバイスを反映するように編集されました。

于 2012-10-22T16:08:28.940 に答える