Question

jsfiddle显示： http://jsfiddle.net/2DUX2/277/

我正在尝试使用工具提示器进行jquery验证。它一直有效，直到我尝试添加更多项目然后它尝试转到表单操作而不是验证新字段。谁知道我做错了什么？

$('#RMAForm input[type="text"], select').tooltipster({
    trigger: 'custom',
    onlyOne: false,
    position: 'right'
});

// initialize validate plugin on the form
$("#RMAForm").validate({
    // any other options & rules,
    errorPlacement: function (error, element) {
        var lastError = $(element).data('lastError'),
            newError = $(error).text();

        $(element).data('lastError', newError);

        if(newError !== '' && newError !== lastError){
            $(element).tooltipster('content', newError);
            $(element).tooltipster('show');
        }
    },
    success: function (label, element) {
        $(element).tooltipster('hide');
    }
});

我在表单元素上使用了必需的类

Answer 1

通常情况下，我会说你没有在动态创建的元素上声明规则。但是，由于您已通过内联属性声明了规则，因此该部分工作正常。绕过验证的表单意味着验证正在被破坏（这种情况不是由于未能在动态元素上声明规则引起的。）

在您的情况下，ToolTipster正在破坏.validate()方法，并由控制台错误验证。

错误：您调用了Tooltipster＆＃34;内容＆＃34;单位元素上的方法

这意味着您必须在创建新元素后调用.tooltipster方法。我只是将以下代码复制到您的click处理程序函数中，并在创建新元素之后将其放置。

$("#AddOne").click(function () { // your code that creates new form elements. // attach ToolTipster to new elements here... $('#RMAForm input, select').tooltipster({ trigger: 'custom', onlyOne: false, position: 'right' }); ....

工作演示：http://jsfiddle.net/2DUX2/278/

Answer 2

对于动态添加的元素，您必须使用委托功能。以下是它的更多信息：jquery delegate

jquery验证未在动态添加的表单字段上触发

2 个答案: