焦点不会隐藏浏览器后退按钮上的提示(jquery.hint.js)

时间:2013-02-12 21:05:37

标签: javascript back-button

我使用jquery.hint.js。在页面加载everiting很好,但当我使用后退浏览器按钮时,焦点不会隐藏提示。

jQuery.fn.hint = function (blurClass) {
    if (!blurClass) {
        blurClass = 'blur';
    }

    return this.each(function () {
        // get jQuery version of 'this'
        var $input = jQuery(this),

        // capture the rest of the variable to allow for reuse
          title = $input.attr('title'),
          $form = jQuery(this.form),
          $win = jQuery(window);

        function remove() {
            if ($input.val() === title && $input.hasClass(blurClass)) {
                $input.val('').removeClass(blurClass);
            }
        }

        // only apply logic if the element has the attribute
        if (title) {
            // on blur, set value to title attr if text is blank
            $input.blur(function () {
                if (this.value === '') {
                    $input.val(title).addClass(blurClass);
                }
            }).focus(remove).blur(); // now change all inputs to title

            // clear the pre-defined text when form is submitted
            $form.submit(remove);
            $win.unload(remove); // handles Firefox's autocomplete
        }
    });
};
正常页面加载的示例:http://prntscr.com/sik0d 使用后退浏览器按钮后的示例:http://prntscr.com/sikap(剂量不隐藏焦点上的提示,只是将文本添加到输入字段)

如何解决这个问题。如何强制此脚本重新加载后退按钮?感谢

1 个答案:

答案 0 :(得分:1)

我终于找到jquery.hint.js女巫包含使用浏览器后退按钮的修复程序。这是一个链接:https://gist.github.com/madmanlear/1723896

JavaScript的:

(function ($) {

$.fn.hint = function (blurClass) {
    if (!blurClass) blurClass = 'blur';

    return this.each(function () {
        var $input = $(this),
            title = $input.attr('placeholder'),
            $form = $(this.form),
            $win = $(window);

        function remove() {
            if ($input.val() === title) {
                $input.val('').removeClass(blurClass);
            }
        }

        // only apply logic if the element has the attribute
        if (title) { 
            // on blur, set value to title attr if text is blank

            $input.blur(function () {
                if (this.value === '' || this.value == title) {
                    $input.val(title).addClass(blurClass);
                }
            }).focus(remove).blur(); // now change all inputs to title

            // clear the pre-defined text when form is submitted
            $form.submit(remove);
            $win.unload(remove); // handles Firefox's autocomplete
        }
    });
};

})(jQuery);