Toggle stopped working after jquery update

2019-02-20 15:24发布

问题:

I was using jquery 1.3 on my website. Today I updated it to newest 1.9 and my toggle/animate script stopped to work.

The code looks like that:

<a href="javascript: void(0);" id="toggler">Show more</a>
<div id="tcontent"> … </div>

$(document).ready(function() {                      
    $('#toggler').toggle(
    function() {
        $('#tcontent').animate({height: "70"}, 800);
    },
    function() {
        $('#tcontent').animate({height: "6"}, 800);
    });
});

What is wrong with this code? When I include back jquery 1.3 to my html everything works fine.

回答1:

Try this

<a href="#" id="toggler" data-show="no">Show more</a>

and

$(function() {                      
  $('#toggler').on("click",function(e) {
      if ($(this).data("show")=="no") {
        $('#tcontent').animate({height: "70"}, 800);
        $(this).data("show","yes");
      }   
      else {
        $('#tcontent').animate({height: "6"}, 800);
        $(this).data("show","no");     
      }
  });
});


回答2:

$('#toggler').click( function() {
    $('#tcontent').toggle(
        function()
        {
            $(this).animate({height: "70"}, 800);
        },
        function()
        {
            $(this).animate({height: "6"}, 800);
        }
    );
});


标签: jquery toggle