2

ajaxを介してコンテンツをロードし、クリックするとhtmlページのスクリプトタグで定義されているJavaScript関数を実行するボタンを含むhtmlフォームがあります。SO:ボタンはajaxを介してロードされます(動作します)が、ボタンがクリックされた場合、目的のアクションがトリガーされず、FirebugでJavaScriptエラーがトリガーされません。既存のJavaScript関数にバインドするためにajaxを介してロードされた一連のボタンのonclickシグナルを取得するにはどうすればよいですか?

編集:私はJQueryを使用していないことにも注意する必要があります。それが唯一の方法である場合はそうするつもりですが、それ以外の場合は、ネイティブJavaScriptのみを使用することをお勧めします。

EDIT2:私の問題はもう少し複雑でしたが、選択した回答で述べたように、ajaxを介してデータを送信する前に、phpスクリプトでonclickイベントハンドラーを設定できるはずです。データ量の多い応答があり、帯域幅を減らしたい場合は、すべてをクライアント側で行うことを検討できますが、ほとんどの場合、phpスクリプトでonclick属性を設定する方が簡単です。

4

3 に答える 3

2

動的に生成されたボタンには、インラインイベントがバインドされている可能性があります。ボタンを生成するときは、ボタンが付いていることを確認するだけonclick="alreadyExistingFunc();"で、ページがボタンを正常に実行します。

または、AJAXデータがドキュメントへの書き込みを終了したら、新しいボタンを見つけて、イベントをそれらにバインドします。

function ajaxSuccess()
{
    document.getElementById('newButtonIdHere').onClick = function() {
        alreadyExistingFunc();
    }
}

それでうまくいくはずです。また、何か(セレクターやイベント処理など)を実行するためにjQueryのごく一部が「必要」な場合は、ほとんどの場合、ライブラリ全体をロードしなくても実行できます。

于 2013-02-16T02:44:34.290 に答える
1

HTML(取得したAJAX応答)をDOMに追加/挿入し、clickイベントをそれにバインドします。

function alreadyExistingFunc() { 
    alert('button is clicked!'); 
}

var ajax_data ="<button id='my-button'>My Button</button>";

$('body').append(ajax_data).find('#my-button').on('click', function(e){
    alreadyExistingFunc();
    // some more code...
});

また:

$('body').append(ajax_data).find('#my-button').on('click', alreadyExistingFunc);
于 2013-02-15T17:09:10.340 に答える
0

コールバックを使用することもできます。

function getAjaxContent(callback) {
    $.ajax({url: "url"}).done(function() {
      callback(data);
    });
}

getAjaxContent(function (data) {
    //ajax content has been loaded, add the click event here
}
于 2013-02-15T17:23:42.853 に答える