0

我有一组带有复选框的列表，当我单击 5 个复选框时，将显示一条警告消息，祝贺您选择了 5 个选项。我必须使用 Promise 进行验证。如果我不使用拒绝，它工作正常。但是，如果我添加下面给出的代码，则会执行“拒绝”代码并将错误显示为“未定义”。我哪里出错了？

let clickvalidation = new Promise(function(resolve, reject) {
  $('input[type=checkbox][id=chk1]').change(function() {
    if ($(this).is(':checked')) {
      noOfClick++;
      if (noOfClick == 5) {
        resolve();
      } else {
        reject();
      }
    }
  });
});

clickvalidation
  .then(function() {
    console.log('Success, You are a GEEK');
    alert(`Congrats 5 tasks have been successfully completed`);

  })
  .catch(function(e) {
    console.log(e.stack);
  });
4

1 回答 1

3

一个承诺只能解决一次。

第一次更改复选框时，您调用reject()并且不传递任何参数（因此它会出现错误undefined消息）。

任何后续更改复选框时，您都会调用reject或resolve但承诺不再待处理。

Promise 是一个很好的工具，可以告诉你什么时候有结果。它们并非旨在提供多种结果。

在这种情况下，promise 不是一个有用的工具。只需单独使用常规事件处理程序。

let counter = 0;

document.querySelector('input').addEventListener('change', () => {
  counter += 1;
});

document.querySelector('button').addEventListener('click', () => {
  if (counter === 5) {
    console.log("OK");
  } else {
    console.log("Not OK");
  }
});
<input type="checkbox"><button>OK</button>

于 2022-02-13T10:11:03.747 回答