Используйте JavaScript для случайного добавления класса CSS в один элемент списка

Question

Эй, у меня нет никакого кода, потому что я не знаю, как это сделать. Я пытаюсь использовать jQuery / javascript для случайного добавления класса CSS "active" к одному элементу списка в неупорядоченном списке, идентифицированном как ul # slide_panels.

Answer 1

Будьте проще. Это возвращает все элементы списка в этом списке:

var items = $("#sliding_panels li");

Затем используйте Math.random(), чтобы выбрать один из них. Примечание: конструкция Math.floor(Math.random() * 10)) вернет целое число от 0 до 9 включительно.

var item = Math.floor(Math.random() * items.length);

Вы можете использовать оператор индекса массива для объекта jQuery, чтобы получить один из этих элементов. Примечание: set[n] эквивалентно set.get(n), если set является объектом jQuery.

Затем вам нужно обернуть этот элемент в объект jQuery и использовать addClass():

$(items[item]).addClass("active");

Answer 2

var elements = $('ul#mylist li');
$ (elements.get (
  Math.round (elements.length*Math.random ()-0.5)
)).addClass ('active');

Answer 3

См. этот вопрос о том, как получить случайный элемент.

$("#sliding_panels li").get().sort(function(){ 
  return Math.round(Math.random())-0.5
}).slice(0,1).addClass("active");

Кредит duckyflip за оригинальный ответ.

Альтернативой является : случайный плагин , упомянутый в том же вопросе.

Пример:

$("#sliding_panels li:random").addClass("active");