0

我对 jQuery 尤其是 javascript 的了解一直非常有限，我正在努力变得更好。

考虑到这一点，我正在尝试创建某种“可扩展的验证框架”，因为我可以创建一个带有验证函数及其错误消息的对象，将其推送到一个数组中，然后调用所有这些方法并报告来自那些失败的。

所以首先我做了一些非常简单的事情，只是为了看看基本的验证是这样的：

var selectedTourDate = $("#tourDate").val();
var list = $("#bookedTourDate *");

var isDateBooked = list.filter(function () {
    return (this.innerHTML == selectedTourDate) ;
}).length !== 0;

if (isDateBooked) {
    alert("Date invalid");
    return;
}

这工作正常。

然后我创建了我的“框架”，它是这样的：

function Validator(fn, errorMessage) {
    this.validationFunction = fn;
    this.errorMessage = errorMessage;
};

var validationRunner = {
    validators: [],
    errorMessages: [],
    validationResult: true,

    addValidation: function (validator) {
        validationRunner.validators.push(validator);
    },

    validate: function () {
        for (var validator = 0; validator < validationRunner.validators.length; validator++) {
            if (validationRunner.validators[validator] instanceof Validator) {
                var result = validationRunner.validators[validator].validationFunction();
                validationResult = validationRunner.validationResult && result;

                if (!result)
                    validationRunner.errorMessages.push(validationRunner.validators[validator].errorMessage);
            }
        }
    },

    getErrorMessage: function () {
        var message = "<ul>";

        for (var errorMessage = 0; errorMessage > validationRunner.errorMessages.length; errorMessage++) {
            message += "<li>" + errorMessage + "</li>";
        }

        message += "</ul>";
        return message;
    }
}

然后修改第一块代码如下：

var selectedTourDate = $("#tourDate").val();
var list = $("#bookedTourDate *");

var tmp = new Validator(function () {
    return list.filter(function () {
         return (this.innerHTML == selectedTourDate);
    }).length !== 0;
}, "Date already booked");

validationRunner.addValidation(tmp);
validationRunner.validate();
var msg = validationRunner.getErrorMessage();

这根本不起作用。

似乎问题在于在此声明中：

返回（this.innerHTML == selectedTourDate）；

“this”是 Validator 对象，而不是列表中的 html 元素，这让我感到困惑，因为它应该在“filter”方法的函数内部。

有没有办法纠正这个问题，所以我可以在这里完成我想要做的事情？

4

2 回答 2

1

this确实有正确的值，但 . 中有一些错误getErrorMessage function。

要检查的值this不要依赖调试器的“监视变量”函数，而是执行一个console.log它将在代码执行的特定点为您提供值。

我的变化：

    for (var errorMessage = 0; errorMessage < validationRunner.errorMessages.length; errorMessage++) {
        message += "<li>" + validationRunner.errorMessages[errorMessage] + "</li>";
    }

该errorMessage变量只是一个索引，而不是实际的错误消息。您还使用了“大于”而不是“小于”符号。

这是一个小提琴

于 2012-08-23T15:18:43.777 回答
0

这很奇怪，因为这应该是每个jquery api的当前 DOM 元素。

不过，该函数应该将索引作为参数。那么试试呢

return list.filter(function (i) {
  return (list.get(i).innerHTML == selectedTourDate);
}).length !== 0;
于 2012-08-23T15:20:11.530 回答