【问题标题】:jQuery Validation Plugin and Tooltipster Plugin errorjQuery 验证插件和 Tooltipster 插件错误
【发布时间】:2014-03-13 20:45:22
【问题描述】:

我正在尝试使用Tooltipster 插件自定义用户收到的错误消息,但遇到了以下问题:

您在未初始化的元素上调用了 Tooltipster 的“内容”方法

我的 HTML 代码:

<form>
  <input id="one" type="number" name="one" />
  <input id="two" type="number" name="two" />
  <button id="button" type="submit">Submit</button>
</form>

Javascript:

$(document).ready(function () {

            $('form').validate({ // initialize the plugin
                rules: {
                    one: {
                        required: true,
                        min: 1,
                        max: 100
                    },
                    two: {
                        required: true,
                        min: 50,
                        max: 80
                    }
                },
                submitHandler: function (form) {
                    doTest();
                    return false;
                },
                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');
                }
            });

        });

可能是什么问题?

【问题讨论】:

    标签: javascript jquery jquery-validate tooltipster


    【解决方案1】:

    控制台错误:

    您在 未初始化 元素上调用了 Tooltipster 的“内容”方法

    问题是您没有正确初始化输入元素上的 Tooltipster 插件。

    // initialize tooltipster on form input elements
    $('form input').tooltipster({  // <-  USE THE PROPER SELECTOR FOR YOUR INPUTs
        trigger: 'custom', // default is 'hover' which is no good here
        onlyOne: false,    // allow multiple tips to be open at a time
        position: 'right'  // display the tips to the right of the element
    });
    

    见:https://stackoverflow.com/a/14741689/594235

    【讨论】:

    • @kalpetros,您必须确保正确定位输入元素。尝试将$('form input[type="text"]').tooltipster(... 更改为$('form input').tooltipster(...
    • 现在可以使用了。我所做的是将$('form input[type="text"]') 更改为$('form input')
    • @kalpetros,是的,只要您选择考虑进行验证的相同输入元素,它就会起作用。 $('form input') 将选择 all form 元素内的 all input 元素。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-12-17
    • 2011-04-22
    • 1970-01-01
    相关资源
    最近更新 更多