Javascript If / Else оператор изменить img src - PullRequest
1 голос
/ 05 января 2011

У меня есть раскрывающееся динамическое выпадающее меню, в которое я хотел бы добавить немного больше функциональности.Меню навигации по страницам и наведение курсора на ссылку изменяет источник изображения в области содержимого, отражая активную ссылку.Это простое изменение attr (src).

Я добавил некоторый код для постепенного исчезновения активного изображения, изменения исходного кода на значение по умолчанию, а также постепенного исчезновения и возврата после выхода из меню, но хотелось бывстроить этот код в оператор If / Else;предотвращение затухания и возврата изображения, если его источник не изменился по умолчанию.

Синтаксис кажется правильным, но функция работает неправильно.Я относительно новичок и, вероятно, что-то упустил.Буду очень признателен за советы по функциональному, более надежному коду!

Спасибо за ваше время, Даниэль


Функция, встроенная в оператор else (исчезновение, изменение источниказатухание) работает так, как мне бы хотелось.

$("#trigger").mouseleave(function(){
    var img = $("#img_home");
    if (img.src = "Images/IMG_4663_bw.jpg"){
      img.noop();
    } else {
      img.fadeOut(1000, function(){
         img.attr("src","Images/IMG_4663_bw.jpg");
         img.fadeIn(1000);
      });
    }
});

Ответы [ 4 ]

3 голосов
/ 05 января 2011
if (img.src = "Images/IMG_4663_bw.jpg")

Вы набираете значение, вам нужен оператор ==, а не оператор =.
Если вы ищете только условие else, только обратное условие:

if (img.attr('src') != "Images/IMG_4663_bw.jpg") {
    // fade and stuff
}
1 голос
/ 05 января 2011

img - это объект jQuery.
Вам нужно получить доступ к его атрибутам, позвонив по номеру img.attr('src').

Ваше if условие присваивает свойство img; для проверки на равенство необходимо использовать операторы == (равенство) или === (строгое равенство).

Метод jQuery noop является статическим; Вы называете это письмом jQuery.noop().

Наконец, нет смысла вообще звонить noop(). Прежде всего, нет ничего плохого в пустой паре фигурных скобок без операторов внутри: if (something) { } else { ... }.
Кроме того, вы можете просто инвертировать условие if и избавиться от else:

if (img.attr("src") === "Images/IMG_4663_bw.jpg") {
  img.fadeOut(1000, function() {
     img.attr("src", "Images/IMG_4663_bw.jpg").fadeIn(1000);
  });
}
0 голосов
/ 05 января 2011

Синтаксис неверен. Вам нужно == в операторе if() вместо =, который выполняет сравнение вместо сравнения.

Кроме того, чтобы напрямую получить доступ к свойству src, вам нужно сделать это из элемента DOM. Вы можете использовать [0], чтобы получить первый img из объекта jQuery.

if (img[0].src == "Images/IMG_4663_bw.jpg"){
    $.noop(); // The noop is called from the global jQuery object.
    //...
0 голосов
/ 05 января 2011

Попробуйте

$("#trigger").mouseleave(function(){
var img = $("#img_home"); 
 if (img.src == "Images/IMG_4663_bw.jpg"){
  img.noop(); 
 } 
 else {
  img.fadeOut(1000,function(){
  img.attr("src","Images/IMG_4663_bw.jpg");
  img.fadeIn(1000); 
  }); 
 } 
});

Разница заключается в сравнении этого источника со строкой пути изображения. Это должно быть '=='

...