-4

これはとても恥ずかしいことです。私はいくつかの同様の投稿をstackoverflowで調べました. Reference Error: Function xxx is not defined の行に沿ったものです。運がない。もちろん、私も実際にこれを Google で検索しましたが、行き止まりしか思いつきませんでした。

簡単に言うと、長い PHP ページを継承しました。スクリプトとスタイルシートをいたるところに縮小して連結します。backbone.js を介して注入されたビジネス ロジック。そのすべてを書いた人々は、私にとって立ち入り禁止です。悪いことだとはわかっていますが、この状況の政治を変えることはできません。

取り決めは次のとおりです。動的に挿入されたページ オーバーレイの一連のアイコン ボタンに Twitter ブートストラップ ツールチップを追加する必要があります。このページ オーバーレイは常に DOM の一部であるとは限りません。したがって、Twitter のブートストラップ ツールチップの開始は、そのページ オーバーレイに影響しません。単に、誰かがボタンをクリックするまで存在しないためです。

ページ オーバーレイを呼び出すボタンに「onclick」を追加して、a) ページ オーバーレイの存在をチェックし、b) ページ オーバーレイでツールチップを開始する関数を呼び出すことができました。その関数は ittps() と呼ばれます。これは、その 1 つの PHP ページの一番下にあります。

<!-- START MANAGEMENT PAGES -->
<script type="text/javascript">
    //  INSTANTIATE TOOLTIPS ON MANAGEMENT PAGES
    //  THIS FUNCTION GETS CALLED FROM: instances-grid-parent
        function ittps(w){

        if(w=='backup'){

            if( $(".management").length ){
                if( $("[data-toggle='tooltip']").length ){
                    $(".mngmnt-icon-restore, [data-toggle='tooltip']").tooltip();
                    console.log('And.......................we are good.');
                }else{
                    setTimeout("ittps();", 500);
                }
            }else{
                console.log('Nothing to do here.......................');
                setTimeout("ittps();", 500);
            }

        }
</script>
</body>
</html>

一番下の script タグ内の関数がドキュメントの残りの部分で利用できると考えているのは、おそらく私があまりにも単純すぎるのではないでしょうか?

基本的に、ボタンがクリックされると、エラーが発生します。

ReferenceError: ittps(w) is not defined.

したがってwindow.ittps = function(w){、コードに追加しようとして、他の多くのことを実行した後 (関数を$(document).ready(function(){キューに追加しようとするなど)、何も機能しませんでした。もう 1 時間で、このことをここの固いキュービクルの壁に投げる準備ができています。

これを機能させる方法について誰かアイデアがありますか? ページ オーバーレイが表示されるのを待ってから、JavaScript コンソール (Firebug) 内で関数を実行すると、動作させることができます。

PS: ページ オーバーレイのコンテンツに JavaScript を追加することはできません。これらのコンテンツは backbone.js によってレンダリングされるためです。そのための回避策があるかどうかはわかりません。この時点で、私はアドバイスを受け取り、実行します。ありがとう。

最後の注意: JavaScript コンソール (Firebug) 内で実行すると、コード自体は完全に実行されます。実行すると、必要に応じてツールリップが表示されます。

var w = 'backup';
if(w=='backup'){

    if( $(".management").length ){
        if( $("[data-toggle='tooltip']").length ){
            $(".mngmnt-icon-restore, [data-toggle='tooltip']").tooltip();
            console.log('And.......................we are good.');
        }else{
            setTimeout("ittps('backup');", 500);
        }
    }else{
        console.log('Nothing to do here.......................');
        setTimeout("ittps('backup');", 500);
    }
}

JavaScript コンソールでこのコードを実行しても機能しますが、ページ オーバーレイが存在する場合、ここで要求されているのはツールチップ コードを含む HTML です。

                <div class="slct-with-icns">
                    <span class="mngmnt-icons mngmnt-icon-restore" rel="tooltip" data-toggle="tooltip" data-placement="top" title="Restore" data-original-title="Restore">.</span>
                    <span class="mngmnt-icons mngmnt-icon-download" rel="tooltip" data-toggle="tooltip" data-placement="top" title="Download" data-original-title="Download">.</span>
                    <span class="mngmnt-icons mngmnt-icon-schedule" rel="tooltip" data-toggle="tooltip" data-placement="top" title="Schedule a Backup" data-original-title="Schedule a Backup">.</span>
                    <span class="mngmnt-icons mngmnt-icon-test" rel="tooltip" data-toggle="tooltip" data-placement="top" title="Test the selected restore action" data-original-title="Test the selected restore action">.</span>
                    <span class="mngmnt-icons mngmnt-icon-delete" rel="tooltip" data-toggle="tooltip" data-placement="top" title="Delete the selected backup" data-original-title="Delete the selected backup">.</span>
                </div>
4

1 に答える 1