0

私は Drupal を使用しており、3 つのフローティング バナーを作成しました。

フロントページには、1 つのフローティング バナーを表示するブロック (block1) があり、更新後に 2 番目のバナーが表示され、3 番目のバナーも表示されます。前に書いたように、これらのバナーにはオーバーフローを止めるための小さな X ボタンがあります。このスクリプトをバナーの 1 つに配置しましたが、うまく機能しています。

<script language="javascript">
function doexpand() {
    document.getElementById("block1").style.overflow = "visible";
}

function dolittle() {
    document.getElementById("block1").style.overflow = "hidden";
}    
</script>

本当の問題は、カテゴリ ページに #block2 があり、記事に #block3 があることです。これらのブロックは同じバナーを表示しています。コード オーバーは 1 つの ID に対してのみ機能します。この場合、#block1. document.getElementById は、他のトピックから読んだように、より多くの ID に対して機能しません。

次のような 2 つのブロック ID を使用して jQuery を試しました。

(function ($) {

    function doexpand() {
     $("#block1,#block2").css("overflow","visible");
    }
    function dolittle() {
     $("#block1,#block2").css("overflow","hidden");
    }

    })(jQuery);

動いていない。firebug/コンソールの表示: ReferenceError: doexpand が定義されていません。

次のようなjQueryでも単一のブロックで試しました：

(function ($) {

        function doexpand() {
         $("#block1").css("overflow","visible");
        }
        function dolittle() {
         $("#block1").css("overflow","hidden");
        }

        })(jQuery);

同じエラーが表示されます。

注: Drupal には別のラッピングがあり、次のようになります。

(function ($) {
        //your existing code
    })(jQuery);
4

1 に答える 1

3

関数をグローバルに定義するか、グローバルに公開する必要があります。

(function ($, window) {

        function doexpand() {
         $("#block1").css("overflow","visible");
        }
        function dolittle() {
         $("#block1").css("overflow","hidden");
        }

        // expose them global
        window.doexpand = doexpand;
        window.dolittle = dolittle;

})(jQuery, window);
于 2013-06-26T07:34:16.877 に答える