Функция анимации jquery при нажатии одной кнопки

    $('.edit').click(function () {
    var anim = 0;
    if(anim == 0){
        $('.foo_menu1').animate({
            bottom:"0px",
            opacity: "1",
            }, 600);

        $('.foo_menu2').animate({
            bottom:"-47px",
            opacity: "0",
            }, 600);

        anim += 1;
    }else{
        $('.foo_menu1').animate({
            bottom:"-47px",
            opacity: "0",
            }, 600);

        $('.foo_menu2').animate({
            bottom:"0px",
            opacity: "1",
            }, 600);
            anim=0;
    }
    });
})

Я новичок в jQuery. пожалуйста, помогите мне, у меня есть одна кнопка и два блока div. по умолчанию появится первое поле div (foo_menu1). при нажатии на кнопку первое поле появится, а второе должно исчезнуть.

но когда я нажимаю в первый раз, он работает хорошо до первого условия IF. но если я снова нажму ту же кнопку, она не войдет внутрь функции else.


jquery jquery-animate
person user687414    schedule 01.04.2011    source источник
comment
Переместите var anim = 0; за пределы функции щелчка. Вы сбрасываете анимацию на ноль каждый клик.   -  person mVChr    schedule 01.04.2011

Ответы (1)


arrow_upward
1
arrow_downward

Вам нужно переместить var anim = 0; наружу и сделать его глобальной переменной.

var anim = 0;

$('.edit').click(function () {
  if(anim == 0){
  // code
  } else {
  }
})

В противном случае вы повторно инициализируете его по щелчку.

Кроме того, я предлагаю вам взглянуть на .data() API jquery, если вы хотите хранить данные, относящиеся к элементам. Это позволит избежать глобальных переменных в вашей области.

http://api.jquery.com/jQuery.data/

person JohnP    schedule 01.04.2011