Javascript if 语句无法正常工作

Question

  //this counts how many images exist
  var img_count = $("#gallery_scroller img").length;
  //this is a number where I want the clicks to stop working
  var limit_count = img_count/3;

  var click_count = 1;

  if ( limit_count > click_count){

    $("#down_arrow").click(function(){
      click_count++
      var css_position = -1*click_count*300;
      $('#gallery_scroller img').css('top', css_position);
      alert(css_position+' '+limit_count+' '+click_count);
    });
  };

我将警报放在最后，以便每次单击时都可以观察到值。即使 click_count 大于 limit_count，它也会继续进行。在 if 条件下，当我将 click_count 替换为大于 limit_count 的实际数字时，它会起作用。

Answer 1

您的 if 语句不在 click 事件处理程序的代码中。附加处理程序后，只有处理程序内的代码会在单击发生时运行。

我不完全确定您想要的结果是什么，但这可能更接近：

//this counts how many images exist
var img_count = $("#gallery_scroller img").length;
//this is a number where I want the clicks to stop working
var limit_count = img_count/3;

var click_count = 1;

$("#down_arrow").click(function(){
    if ( limit_count > click_count){
        click_count++;
        var css_position = -1*click_count*300;
        $('#gallery_scroller img').css('top', css_position);
        alert(css_position+' '+limit_count+' '+click_count);
    }
});

例如，将测试放在事件处理程序代码中。

---

旁注：if 块上的大括号末尾不需要分号，例如：

    if (...) {
    };
//   ^--- no semi here

旁注 2：我在 click_count++ 之后添加了分号。如果没有它，您将依赖于自动分号插入这一可怕的东西。你没问题，因为后面有一个换行符，但总的来说，最好学习分号的规则，并始终将它们包含在需要的地方。

Answer 2

您的条件需要位于事件处理程序内：

var click_count = 1;

$("#down_arrow").click(function(){
  if ( click_count < limit_count ){
    click_count++;
    var css_position = -1*click_count*300;
    $('#gallery_scroller img').css('top', css_position);
    alert(css_position+' '+limit_count+' '+click_count);
  };
});

Answer 3

$("#down_arrow").click(function(){
 if ( limit_count > click_count){
    click_count++
    var css_position = -1*click_count*300;
    $('#gallery_scroller img').css('top', css_position);
    alert(css_position+' '+limit_count+' '+click_count);
  };
});