как дважды использовать jquery replaceWith в документе?

Я пытаюсь активировать функцию jQuery «replaceWith» при нажатии, чтобы заменить div1 на div2, а затем снова использовать «replaceWith», чтобы заменить div2 на div1 при нажатии.

все работает, за исключением того, что при нажатии на div2 div1 не появляется снова.

мой код:

$(document).ready(function(){
$("#open_doors").click(function(){
$("#leftdoor_inner").animate({"left": "-=164px"}, 'slow');
$("#leftdoor_outer").animate({"left": "-=74px"},'slow');
$("#rightdoor_inner").animate({"left": "+=164px"},'slow');
$("#rightdoor_outer").animate({"left": "+=74px"},'slow');
$("#open_doors").replaceWith($("#close_doors"));
});
$("#close_doors").click(function(){
$("#leftdoor_inner").animate({"left": "+=164px"},'slow');
$("#leftdoor_outer").animate({"left": "+=74px"},'slow');
$("#rightdoor_inner").animate({"left": "-=164px"},'slow');
$("#rightdoor_outer").animate({"left": "-=74px"},'slow');
$("#close_doors").replaceWith($("#open_doors"));
});
});​

почти рабочий jsfiddle здесь:

http://jsfiddle.net/9zsdN/2/

я почти уверен, что на мой вопрос ответили по ссылке ниже, но я не могу понять, как применить его к моему точному коду.

События, не регистрируемые после replaceWith

Спасибо.


jquery replacewith
person user1063287    schedule 25.10.2012    source источник
comment
Проблема не имеет ничего общего с событиями. Когда вы заменяете div1 на div2, div1 больше не существует, поэтому вторая замена ничего не заменяет.   -  person Barmar    schedule 25.10.2012

Ответы (1)


arrow_upward
3
arrow_downward

вместо replaceWith вы можете просто использовать show() и скрыть()

 $(document).ready(function(){
      $("#open_doors").click(function(){
        $("#leftdoor_inner").animate({"left": "-=164px"}, 'slow');
        $("#leftdoor_outer").animate({"left": "-=74px"},'slow');
        $("#rightdoor_inner").animate({"left": "+=164px"},'slow');
        $("#rightdoor_outer").animate({"left": "+=74px"},'slow');
        $("#open_doors").hide();
        $("#close_doors").show();
      });
     $("#close_doors").click(function(){
         $("#leftdoor_inner").animate({"left": "+=164px"},'slow');
         $("#leftdoor_outer").animate({"left": "+=74px"},'slow');
         $("#rightdoor_inner").animate({"left": "-=164px"},'slow');
         $("#rightdoor_outer").animate({"left": "-=74px"},'slow');
         $("#close_doors").hide();
         $("#open_doors").show();
     });
   });

Демо

person YogeshWaran    schedule 25.10.2012