проблема при обходе элементов списка с помощью .next () - PullRequest
Новая
       14

проблема при обходе элементов списка с помощью .next ()

0 голосов
/ 16 апреля 2011

Привет, я отображаю окно с ajax возвращенными результатами, в котором есть от 1 до 4 элементов списка

при нажатии стрелки вниз я устанавливаю цветную рамку для следующего элемента списка.я пытался с .next ().что происходит, когда я нажимаю стрелку вниз, все элементы, кроме первого, выделяются, я не могу это сделать.помогите мне 

$('.input_for_chain_and_target').keyup(function(){data_fr_chain_and_target(this.id);});
$('.input_for_chain_and_target').bind('keydown',controlling_with_nav_keys);



function controlling_with_nav_keys(event){
var keycode = (event.keyCode ? event.keyCode : event.which);
if(keycode==40){//alert('down');
    $('.target_frnd_content').next().css('border','2px dashed #6698FF');
}
else if(keycode==38){
    $('.target_frnd_content').prev().css('border','2px dashed #6698FF');
}

я пытался вставить его, но он искажается из-за генерации HTML по php-коду

вот примерная копия 

<li style='border:1px solid #F4F3F0;' class='target_frnd_content' id=\"$target_frnd_content_id\">
$ usr_img $ usr_namex (Дополнительное сообщение)

Ответы [ 4 ]

0 голосов
/ 17 апреля 2011

Попробуйте: 

$('.target_frnd_content').next().css({'border-width','2px', 'border-style': 'dashed', 'border-color': '#6698FF'});
0 голосов
/ 16 апреля 2011

хорошо, я думаю, вот в чем проблема: 

$('.target_frnd_content').next().css('border','2px dashed #6698FF');

это должно быть: 

$('.target_frnd_content').next().css({'border':'2px dashed #6698FF'});

Помните, что вы должны передать объект JSON в метод css () при добавлении любого стиля.Надеюсь, это поможет.

0 голосов
/ 17 апреля 2011

Хорошо, я понял. По сути, вы выбираете элемент через его имя класса, которое называется "target_frnd_content", и я считаю, что вы дали бы то же имя класса для остальных элементов, и поэтому он выбирает все следующие элементы, так как каждый элемент имеет одинаковое имя класса. Вы должны уникально идентифицировать каждый элемент списка, возможно, добавив атрибут id к каждому из них. Что еще вы можете сделать, это что-то вроде этого: 

<ul class="some_list">
  <li class="current">Item one</li>
  <li>Item two</li>
  <li>Item three</li>
</ul>

тогда в javascript вы скажете: 

var current = $('li.current');
current.removeClass('current').next().addClass('current');

Теперь вы можете установить любой стиль для текущего класса в файле CSS, например: 

li.current{border: 2px dashed #6698FF;}
0 голосов
/ 16 апреля 2011

пожалуйста, укажите ваш HTML-код, next () обязательно должен выбрать следующий элемент списка.Вы выбираете правильный элемент списка

, используя его имя класса (.target_frnd_content)?
...