jQuery返回false无效

Question

我有一张桌子，并且遍历每一行。 如果行背景色为绿色，并且未选中其相应类为线框的复选框，则我应该在单击提交时显示一条错误消息。 但是返回false无效，并且正在提交表单。尽管正在显示消息。 我该如何解决？ 下面是代码。

jQuery(document).on('click', '#add-All-button', function () {
  $(".rowb").each(function() {                       
    if($(this).css("background-color") == "rgb(71, 163, 71)") {
      var ischk = 0;
      var row = $(this);                        
      if (row.find('input[class="linebox"]').is(':checked') ) {
        ischk++;
      }
      if(ischk==0) {
        alert('Every green colored row should have one of the checkboxes checked.');
        return false;
      }
    }                       
  });
});

Answer 1

您不会从事件处理程序中返回false ，而只是从$.each回调中返回。 如果您还想从处理程序中返回false ，则在处理程序本身中将需要return语句。

例如，也许（请参阅***行）：

jQuery(document).on('click', '#add-All-button', function() {
    var rv; // *** By default it's `undefined`, which has no special meaning, so that's fine
    $(".rowb").each(function() {
        if ($(this).css("background-color") == "rgb(71, 163, 71)") {
            var ischk = 0;
            var row = $(this);
            if (row.find('input[class="linebox"]').is(':checked')) {
                ischk++;
            }
            if (ischk == 0) {
                alert('Every green colored row should have one of the checkboxes checked.');
                rv = false; // ***
                return false;
            }
        }
    });
    return rv; // ***
});

---

旁注：这种比较很可能会失败：

$(this).css("background-color") == "rgb(71, 163, 71)"

不同的浏览器以不同的格式返回颜色信息，并且不会以（设置必要的）相同的格式返回值。 jQuery不会尝试对此进行标准化。 所以，你回来的价值可能是"rgb(71, 163, 71)"但它也可能是"rgb(71,163,71)"或"rgba(71, 163, 71, 0)"或"rgba(71,163,71,0)"或什至"#47A347" 。 与其依赖于获取特定格式的值，不如使用data-*属性或通过jQuery data函数跟踪的值来更好。

---

旁注2：我不会使用按钮的click事件来挂接到表单提交过程。 我会改用form的submit事件。

Answer 2

您需要在外部函数中返回false，在.each中返回false只会中断循环。 您可能需要用来停止表单提交的另一个事件是event.preventDefault ，它可以用于停止浏览器的默认行为，例如转到链接或提交表单，但是您需要更改按钮上的事件类型以匹配这个适当。 也就是说，您应该听的事件是提交。 请查看下面的固定代码以获取更多详细信息。

 jQuery(document).on('submit', '#add-All-button', function() {
     var out = true;
     $(".rowb").each(function() {
         if ($(this).css("background-color") == "rgb(71, 163, 71)") {
             var ischk = 0;
             var row = $(this);
             if (row.find('input[class="linebox"]').is(':checked')) {
                 ischk++;
             }
             if (ischk == 0) {
                 alert('Every green colored row should have one of the checkboxes checked.');
                 out = false;
             }
         }
     });
     if (!out) { event.preventDefault(); }
     return out;
 });