1

jQueryは初めてで、これを機能させることはできません。jQuery $ .ajax()を使用してMYSQLデータベースからコンテンツを取得しました。その部分は機能します。そのコードは、以下のonBeforeLoadイベントで確認できます。

このコンテンツをjQueryToolsオーバーレイにロードしたいと思います。そのコンテンツをID「contentWrap」のブロックにダンプしました。

jQueryToolsオーバーレイのドキュメントには、onBeforeLoadイベントを使用して外部ページをオーバーレイにロードする例がありますが、そのコードを自分の目的に適合させることができませんでした。http://jquerytools.org/demos/overlay/external.htmlからの例を次に示します。

onBeforeLoad: function() {

    // grab wrapper element inside content
    var wrap = this.getOverlay().find(".contentWrap");

    // load the page specified in the trigger
    wrap.load(this.getTrigger().attr("href"));
}    

オーバーレイ呼び出しのonBeforeLoadイベントにajaxコードを入れようとしましたが、機能しませんでした。では、コンテンツをオーバーレイに直接ロードするにはどうすればよいですか?

さて、いくつかの変更の後、これが実際に実行されているコードですが、まだ機能していません:

JQUERY:

$("a.noteref[rel]").overlay({
mask: {
    color: '#000',
    loadSpeed: 100,
    opacity: 0.7
},
closeOnClick: true,
fixed: false,
onBeforeLoad: function() {
        $.ajax({
            url: 'api.php',
            data: "ID=" + $(this).attr('id').replace('#', ''),
            type: 'post',
            dataType: 'json',
            success: function(data) {
                var id = data[0];
                var vtype = data[1];
                var vcontent = data[2];
                var vlink = data[3];
                var data

                $('#contentWrap').html(vcontent);
                }
        });
        var wrap = this.getOverlay().find("#contentWrap");
        wrap.load();

    }
});

HTML:

<a hef="http://www.example.com/" class="noteref" id="cite01">Example</a>

<div class="overlay">
    <div id="contentWrap"></div>
</div>
4

0 に答える 0