4

我正在使用 Qtip 2 进行 MVC 验证，如此处所述

qtip 工作正常，但是当我滚动页面时我有一个奇怪的问题 Qtips 位置仍然静止（假设随着控件的移动而移动。）

我在 jquery.validate.unobtrusive.js 中的代码

    function onError(error, inputElement) {  // 'this' is the form element       
    var container = $(this).find("[data-valmsg-for='" + inputElement[0].name + "']"),
    replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false;

    // Remove the following line so the default validation messages are not displayed       
    // container.removeClass("field-validation-valid").addClass("field-validation-error");

    error.data("unobtrusiveContainer", container);

    if (replace) {
        container.empty();
        error.removeClass("input-validation-error").appendTo(container);
    }
    else {
        error.hide();
    }

    /**** Added code to display the error message in a qTip tooltip ****/
    // Set positioning based on the elements position in the form
    var elem = $(inputElement),
        corners = ['top right', 'left bottom'],
        flipIt = elem.parents('span.right').length > 0;

    // Check we have a valid error message
    if (!error.is(':empty')) {
        // Apply the tooltip only if it isn't valid
        elem.filter(':not(.valid)').qtip({
            overwrite: false,
            content: error,
            position: {                    
                my: corners[flipIt ? 0 : 1],
                at: corners[flipIt ? 1 : 0],
                viewport: $(window)
            },
            show: {
                event: false,
                ready: true
            },
            hide: false,

            style: {
                classes: 'qtip-red' // Make it red... the classic error colour!
            }
        })

        // If we have a tooltip on this element already, just update its content
        .qtip('option', 'content.text', error);
    }

        // If the error is empty, remove the qTip
    else { elem.qtip('destroy'); }
}

版本详情：Qtip 2 Jquery 1.9.1 mvc 4

当我的控件在页面中移动时，我想移动 Qtip。提前致谢。

4

1 回答 1

4

对我来说真正有效的是指定position.container让 qtip 知道应该将 qtip 附加到哪个元素。这样，当您滚动时，qtip 应该随之滚动。

$('.selector').qtip({
    content: {
        text: 'I am appended within a custom tooltips DIV'
    },
    position: {
        container: $('div.tooltips')
    }
});

文档可以在这里找到：http: //qtip2.com/options#position.container

于 2014-07-17T09:50:56.350 回答