j-й выбор nth и setInterval - PullRequest
       20

j-й выбор nth и setInterval

0 голосов
/ 21 июня 2010

Привет всем.По сути, я хочу, чтобы следующее изображение нажималось с помощью jquery каждую секунду:

jQuery:

 var i=1;

 setInterval(function() {
  $(".portfolio :nth-child("+i+")").click();
  if (i<5) {i++;} else {i=1;}

 }, 1000);

HTML:

<div class="portfolio"> 
  <ul> 
   <li><img src="images/4.jpg" alt="4" id="promo_one"></li> 
   <li><img src="images/1.jpg" alt="1" id="promo_two"></li> 
   <li><img src="images/2.jpg" alt="2" id="promo_three"></li> 
   <li><img src="images/3.jpg" alt="3" id="promo_four"></li> 
  </ul> 
 </div> 

Заранее спасибо:)

Ответы [ 7 ]

1 голос
/ 21 июня 2010

Я думаю, что вы хотите проверить, если i меньше 4, так как у вас есть 4 ссылки.

if (i<4) {i++;} else {i=1;}

Поскольку :nth-child является индексом на основе 1 и 4меньше чем 5, когда вы получаете 4, оно увеличивается до 5, но нет :nth-child(5).

Как уже отмечалось, вы хотите указать :nth-childтакже на правильный элемент.

Пример: http://jsfiddle.net/JBt6b/

1 голос
/ 21 июня 2010

Вместо :nth-child() вы можете использовать .eq() здесь, вот так:

var i=1;
setInterval(function() {
  $(".portfolio ul li img").eq(i).click();
  i = i==3 ? 0 : i + 1;
}, 1000);

Ваш селектор также должен опуститься до <img> (или пропустите часть img, если вы хотите щелкнуть <li>), иначе вы щелкаете и другие элементы.Он получает все изображения и захватывает одно изображение с индексом, который вы хотите, используя .eq(index), чтобы вы могли .click() it.

1 голос
/ 21 июня 2010

Я думаю, что ваш селектор должен быть:

$(".portfolio > ul > li:nth-child("+i+")").click();

... например, вы ищете nth li, который является потомком ul, который является потомком .portfolio. Это дочерние селекторы. Возможно, вы могли бы использовать селектор потомков вместо этого, но я думаю (предположим), что дочерние селекторы будут немного более эффективными, поскольку у них меньше поиска. (Конечно, они также будут более хрупкими, если вы измените свою структуру.)

См. Также точку зрения Патрика о вашем i<4 сравнении, возможно, оно на единицу меньше.

0 голосов
/ 21 июня 2010

Я бы предварительно вычислил многие элементы и использовал бы модульную арифметику для поворота изображений.

var images = $('.portfolio img').;
var count = images.length;
var lastClicked = count - 1;

setInterval( function() {
    var next = ++lastClicked % count;
    images.eq(next).click();
}, 1000);
0 голосов
/ 21 июня 2010

Я думаю, что вы близко (я не уверен, что именно не работает), но вы можете изменить свой селектор с:

".portfolio :nth-child("+i+")"

до:

".portfolio ul li:nth-child("+i+")"

, если вы хотите выбрать n-й элемент li. Я не уверен, что еще не так с кодом, пожалуйста, уточните свой вопрос, если это не решит вашу проблему.

0 голосов
/ 21 июня 2010

Измените свой код JavaScript следующим образом:

var i=1;

setInterval(function() {
  $(".portfolio ul :nth-child("+i+")").click();

  if (i<5) {i++;} else {i=1;}

}, 1000);

В вашем примере .portfolio не имеет n дочерних элементов, оно имеет 1.

0 голосов
/ 21 июня 2010
var i=1;

setInterval(function(){
   $('.portfolio').find('img[alt=' + i + ']').trigger('click');
   if(i < 4) i++; else i=1;
}, 1000);

При поиске атрибута ALT эта задача имеет лучшую производительность (как и много). Имеет смысл только в том случае, если атрибут ALT всегда присутствует.

...