0

から HTML5 プレゼンテーションで動的なプレゼンテーション コンテンツを開発したい

http://www.script-tutorials.com/creating-an-attractive-presentation-with-html5/

このチュートリアルは、静的コンテンツには問題ありません。しかし、私は次のようにjqueryで動的コンテンツを書きたいです:

$(document).ready(function(){

            $.getJSON(url, function (data) {

                   for(var i in data)
                       {                             
                        output=" <button title='Next' id='nav-next' class='nav-next'>Click</button>";                      
                       }

                    $("#placeholder").append(output);
                });
 });

ボタンをクリックすると、次のスライドに移動します。しかし、このイベントは機能しません。JavaScriptファイルで次の関数を呼び出したい。助けてください。

4

2 に答える 2

1

「ボタンをクリックしたとき」とおっしゃいましたが、それが回答の使い方jQuery.on()です。

$('#nav-next').on('click',(function () {
     // click code.
});

DOMで定義された id で作成する.onと、クリック イベントが動的にアタッチされます。

于 2013-02-26T03:43:19.667 に答える
0

新しいボタンにイベントを添付するのではなく、jQueryclickメソッドを使用してこれを行うことができます。

また、いくつかの他の問題:

  • ループは冗長なようです。実際には何も使用していませんdata。
  • outputあなたの例ではグローバル変数として定義されています。これを使用varして関数スコープ内に保持します。

コード：

$(document).ready(function() {
    $.getJSON(url, function (data) {

        // use var, your output was a global variable
        var output = " <button title='Next' id='nav-next' class='nav-next'>Click</button>";                      

        $("#placeholder").append(output);

        // attach the click event to the new button
        $('#nav-next').click(function () {
            // TODO: Implement click method
        });
    });
});

getJSONデータを使用していないため、現在安全に呼び出しを削除できます。なんらかの理由で入れたとします。

于 2013-02-26T02:59:11.367 に答える