Question

我卡住了，我在有人点击时设置变量，然后用if测试是否存在该变量并执行其他操作。它是一个简单的剧本，我可能会过度思考，会喜欢别人的想法。

  $('.view-alternatives-btn').live('click', function() {



//$("#nc-alternate-wines").scrollTo();
   //$('.nc-remove').toggle();
   var showBtn = null;
   if (showBtn == null) {
   $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif");
   $('#nc-alternate-wines').show();
   showBtn = 1;
   console.log(showBtn);
   }
   else if (showBtn == 1) {
   $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif");
   $('#nc-alternate-wines').hide();
   console.log("this " + showBtn);
   }
   return false; 
  });

Answer 1

单击按钮时，总是将其设置为null，因此您永远不会到达else if ...

您可以使用全局变量或$.data()

Answer 2

showBtn是一个局部变量，因此它的值不会在click个事件中保留。

将var showBtn = null;移到click处理程序之外。

然而，最好的方法是调用jQuery的toggle method。（toggle不能与live一起使用）

Answer 3

您将showBtn声明为本地变量，因此它只会在您的点击处理程序结束之前存在。如果你想在第一次点击时将其设置为1并且能够在第二次点击时检查1，则需要一个全局变量。

Answer 4

单击时变量将永远不存在，因为它在函数内部初始化，然后在函数结束时丢失。

如果您想在点击之间存储它，请在点击处理程序之外创建它。

  var showBtn = null;

  $('.view-alternatives-btn').live('click', function() {

     //$("#nc-alternate-wines").scrollTo();
     //$('.nc-remove').toggle();

   if (showBtn == null) {
       $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif");
       $('#nc-alternate-wines').show();
       showBtn = 1;
       console.log(showBtn);
   }
   else if (showBtn == 1) {
       $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif");
       $('#nc-alternate-wines').hide();
       console.log("this " + showBtn);
   }
   return false; 
  });

Answer 5

第一个问题是函数的变量showBtn是local，因此每次执行脚本时都会重新定义它。
其次，在检查之前设置其值...因此它将始终设置为null ..

因为你用live方法绑定它，这意味着动态元素，我会使用.data()方法。

$('.view-alternatives-btn').live('click', function() {

var showBtn = $(this).data('showBtn');
//$("#nc-alternate-wines").scrollTo();
   //$('.nc-remove').toggle();
   if ( showBtn ) {
   $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif");
   $('#nc-alternate-wines').show();
   $(this).data('showBtn',true);
   console.log(showBtn);
   }
   else{
   $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif");
   $('#nc-alternate-wines').hide();
   console.log("this " + showBtn);
   }
   return false; 
  });

Answer 6

太棒了，谢谢大家的帮助！

我开始工作了！

  var showBtn = 1;

  $('.view-alternatives-btn').live('click', function() {

     //$("#nc-alternate-wines").scrollTo();
     //$('.nc-remove').toggle();

   if (showBtn == 1) {
       $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif");
       $('#nc-alternate-wines').show();
       showBtn = 0;
       console.log(showBtn);
   }
   else {
       $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif");
       $('#nc-alternate-wines').hide();
       console.log("this " + showBtn);
       showBtn = 1;
   }
   return false; 
  });

单击jQuery交换图像和if / else

6 个答案: