Javascript помещает оператор if внутри append ('')?

Хорошо, так вот, у меня есть этот скрипт, который делает именно то, что я хочу; Я использую его для добавления фона fadeIn/fadeOut, используя jquery для моей панели навигации.Javascript помещает оператор if внутри append ('')?

С моей конструкцией у меня есть изображение разделителя в конце каждого li в ul для моей навигационной панели; чтобы добавить это, я помещаю span in с классом «sep», который содержит мой css, чтобы добавить изображение разделителя в качестве фона в нужном месте.

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

Текущий Пример Состав: (пункт 1 | Пункт 2 | Пункт 3 |)

То, что я хочу, чтобы это было: (Пункт 1 | Пункт 2 | Пункт 3)

Теперь, чтобы сделать это внутри javascript мне как-то нужно было бы устранить весь "<span class="sep"></span>" или только "class="sep"" ТОЛЬКО на моем последнем элементе li nav (его номер № n7)

Итак, я предполагаю, что это общий способ сделать это: добавить if, если текущий идентификатор li НЕ # n7 (мои идентификаторы li идут от # n1 до # n7, # n7 bein г окончательный), то он помещается в "<span class="sep"></span>", так что если это было № n7, оно не включало бы его

Любая помощь была бы замечательной, спасибо.

Javascript Код:

$(document).ready(function() { 

//Append a div with hover class to all the LI 
$('#nav li').append('<div class="hover"><span class="sep"></span></div>'); 



$('#nav li').hover(

    //Mouseover, fadeIn the hidden hover class 
    function() { 

    $(this).children('div').fadeIn('1000'); 

    }, 

    //Mouseout, fadeOut the hover class 
    function() { 

    $(this).children('div').fadeOut('1000'); 

}).click (function() { 

    //Add selected class if user clicked on it 
    $(this).addClass('selected'); 

}); 

});

источник

2010-12-08 Nto

Это, вероятно, стоит отметить, что вы можете поместить разделитель после элементов списка только с помощью CSS, нет необходимости писать Javascript для него. – Chuck 2010-12-08 02:42:37

Это потому, что это для эффекта фонового фонового эффекта fakein/fadeout; это не просто редактирование css. – Nto 2010-12-08 02:45:03

Вы можете использовать :last-child псевдо-класс для выбора последнего ребенка и :not(), чтобы выбрать все, кроме этого. Также >, чтобы не спускаться с нескольких уровней, а только смотреть на детей.

$('#nav > li:not(:last-child)').append('<div class="hover"><span class="sep"></span></div>'); 
$('#nav > li:last-child').append('<div class="hover"></div>');

Это стандартный селектор CSS; в jQuery он всегда будет работать, но в качестве селектора CSS он не будет работать в любой текущей версии IE.

источник

2010-12-08 02:35:46

Хотел бы я понять, почему это было отклонено. И почему мессианское решение Джейкоба было проголосовано. – 2010-12-08 02:41:04

$('#nav li').each(function() { 
    var append_separator = (this != $('#nav li:last')[0]); 
    $(this).append('<div class="hover">' + ((append_separator) ? '<span class="sep"></span>' : '') + '</div>') 
});

jsFiddle example

источник

2010-12-08 02:35:50

Javascript помещает оператор if внутри append ('')?

ответ

Смежные вопросы