jQuery插件可能的范围问题?

时间:2011-05-17 19:26:50

标签: jquery plugins jquery-plugins scope

我正在尝试创建一个jquery插件(只是为了好玩)而我似乎无法在某个部分做我想做的事。

(function($){

    var resetText = function(){ if (this.value == "") this.value = this.title; }
    var clearText = function(){ if (this.value == this.title) this.value = ""; }

    $.fn.placeHolder = function() {
        return this.each(function(){
            resetText(); // <-- this doesn't work
            $(this).focus(clearText).blur(resetText);
        });
    };
})(jQuery);

基本上,我希望在doc.ready AND on field.blur上将title属性复制到value属性(如果值为空)

就像现在一样,它适用于布尔,但不适用于document.ready

我觉得这是一个范围的事情,但说实话,我不知道如何解决它。

亲眼看看:http://jsfiddle.net/Usk8h/

2 个答案:

答案 0 :(得分:3)

您有this个问题,而非范围问题。

请改为:

resetText.call( this );

.call()方法允许您将this函数中resetText()的值设置为您传递的第一个参数。

在这种情况下,您在this中传递.each()所代表的DOM元素。


修改

您实际上可以将插件缩小到这个:

$.fn.placeHolder = function() {
    return this.focus(clearText).blur(resetText).blur(); // <-- triggers blur
};

答案 1 :(得分:0)

它似乎确实是一个范围问题。怎么样?

http://jsfiddle.net/Usk8h/1/

(function($){

    var resetText = function(myThis){ if (myThis.value == "") myThis.value = myThis.title; }
    var clearText = function(myThis){ if (myThis.value == myThis.title) myThis.value = ""; }

    $.fn.placeHolder = function() {
        return this.each(function(){
            resetText(this);
            $(this)
                .focus(function(){
                    clearText(this);
                }).blur(function(){
                    resetText(this);   
                });
        });
    };
})(jQuery);