1

私は次のように始まるjQueryプラグインを書いています:

$.fn.kewTip = (function() {
    var $kewtip = $('<div></div>').css({'position':'absolute','zIndex':2147483647}).attr({'class':'kewtip'}).hide().appendTo('body');

ページの本文にすぐに要素を追加することに気付くでしょうが、DOM の準備が整うまでそれを行うことはできません。つまり、DOM の準備が整うまでプラグインを定義することはできません。

$('xxx').kewTip()ただし、の外部で呼び出しを試みても失敗しないようにするのが理想的です$(document).ready({ ... })。では、どうすればこれを回避できますか？

私のプラグインはこの要素の存在に依存しています。DOM の準備が整う前にどのように定義すればよいでしょうか?

4

2 に答える 2

4

divプラグイン メソッドが最初に呼び出されたときに が存在することを確認したいだけの場合は、それを作成します。要素 (追加要素、イベント ハンドラー) を操作するために、要素を DOM に追加する必要はありません。

次に、独立してbody、DOM のロード時に要素を追加します。

例えば：

$.fn.kewTip = (function() {
    // create element
    var $kewtip = $('<div />', {
        'class': 'kewtip',
        'style': 'position:absolute;zIndex:2147483647;display:none'
     });

    // add to DOM once it is ready
    $(function() {
        $kewtip.appendTo('body');
    });

    return function() {
        // here you can do whatever with `$kewtip` no matter whether it was 
        // already appended to body or not
    }
}());

（そこに自己呼び出し機能があると思います）

于 2012-06-20T16:26:14.607 に答える
0

Joyの提案に基づいて、私はこれを思いつきました：

$.fn.kewTip = (function() {
    var $kewtip = $();
    $(function() {
        $kewtip = $('<div></div>').css({'position':'absolute','zIndex':2147483647}).hide().appendTo('body');
    });

$()空の jQuery オブジェクトを与えるだけなので、準備が整う前にコードの残りの部分が壊滅的に失敗することはありません。

于 2012-06-20T16:25:54.063 に答える