jQuery返回false不起作用

Question

我有一个表，我遍历每一行。 如果行背景颜色为绿色，并且未选中其相应的类为 linebox 的复选框，我应该在单击提交时显示错误消息。 但是返回 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;
 });