Question

Jquery新手在这里=）所以我有一个代码将菜单div向右滑动，问题是我不希望菜单在第一次点击任何这些div后继续做动画。我试过返回假，但没有帮助。这是代码：

$(document).ready(function(){

  $("#menu_home").click(function(){
    $("#menu_home").animate({"left": "+=419px"}, "slow");
      $("#menu_portfolio").animate({"left": "+=313px"}, "slow");
      $("#menu_us").animate({"left": "+=210px"}, "slow");
      $("#menu_blog").animate({"left": "+=104px"}, "slow");

  });

  $("#menu_portfolio").click(function(){
    $("#menu_home").animate({"left": "+=419px"}, "slow");
      $("#menu_portfolio").animate({"left": "+=313px"}, "slow");
      $("#menu_us").animate({"left": "+=210px"}, "slow");
      $("#menu_blog").animate({"left": "+=104px"}, "slow");
  });

  $("#menu_us").click(function(){
    $("#menu_home").animate({"left": "+=419px"}, "slow");
      $("#menu_portfolio").animate({"left": "+=313px"}, "slow");
      $("#menu_us").animate({"left": "+=210px"}, "slow");
      $("#menu_blog").animate({"left": "+=104px"}, "slow");
  });

  $("#menu_blog").click(function(){
    $("#menu_home").animate({"left": "+=419px"}, "slow");
      $("#menu_portfolio").animate({"left": "+=313px"}, "slow");
      $("#menu_us").animate({"left": "+=210px"}, "slow");
      $("#menu_blog").animate({"left": "+=104px"}, "slow");
  });

});

Answer 1

您应该熟悉jQuery的one()事件。它只会发射一次。

 // bind event to each matched element
 $("#menu_home, #menu_portfolio, #menu_us, #menu_blog").one('click', function(){
    $("#menu_home").animate({"left": "+=419px"}, "slow");
    $("#menu_portfolio").animate({"left": "+=313px"}, "slow");
    $("#menu_us").animate({"left": "+=210px"}, "slow");
    $("#menu_blog").animate({"left": "+=104px"}, "slow");
    // unbind event so remainder of elements wont fire event
    $("#menu_home, #menu_portfolio, #menu_us, #menu_blog").unbind('click');
 });

Answer 2

您需要取消绑定元素中的click事件。你可能想要

$("#menu_home, #menu_portfolio, #menu_us, #menu_blog").unbind('click');

每个方法结束时

。

Jquery问题：尝试在第一次单击后停止动画

2 个答案: