2011-05-23 12 views
0

私はロシア出身ですので、悪い英語を申し訳ありません。 私はajaxでウェブページの一部を読み込んでいます。例えばJQuery - ajaxのボタン

<script type="text/javascript"> 
$("#link1").click(function(){ 
    $.post("ajax.php", { act: "load" }, 
    function(data) { 
     $("#content").html(data); 
    }); 
}); 
</script> 

<a href="#" id="link1">Click</a> 
<div id="content"></div> 

Ajax.phpを返します:<input type="button" id="button1" value="test">

は今、私はあまりにもスクリプトからこのボタンを制御したいです。 私は試しています:

<script type="text/javascript"> 
    $("#link1").click(function(){ 
     $.post("ajax.php", { act: "load" }, 
     function(data) { 
      $("#content").html(data); 
     }); 
    }); 

    $("#button1").click(function(){ 
     alert('test'); 
    }); 
</script> 

しかし、これはうまくいきません。手伝って頂けますか?ありがとう。それは、使用する

答えて

2
$("#button1").click(...); 

は何もしません($("#button1")は、任意の要素を選択しません)。

どちらかがあなたのAjaxリクエストのコールバックにそれを置く:

$.post("ajax.php", { act: "load" }, function(data) { 
    $("#content").html(data); 
    $("#button1").click(function(){ 
     alert('test'); 
    }); 
}); 

または.delegate()/.live()を使用します。

$("#content").delegate('#button1', 'click', function(){ 
    alert('test'); 
}); 
+0

ありがとうございます! – Anton

1

変更:

$("#button1").live('click', function(){ 
    alert('test'); 
}); 

live関数は、イベントが動的にページに追加された要素から発射することができます。あなたがそのコードを実行するときに要素#button1がまだ存在しないため、

0

をあなたは現在上ある任意のボタンのクリックイベントを登録しますページ。あなたのリンクがクリックされるまでに、すでに登録されています。

Richard Dが述べたようにライブイベントを使用します。がセレクタとして使用しているIDと一致するボタンのイベントを設定します。

1

この部分:スクリプトが最初に実行とき

$("#button1").click(function(){ 
    alert('test'); 
}); 

は、ID button1を持つ既存のDOM要素にクリックハンドラを取り付けています。そのボタンは手動でlink1要素をクリックするまで存在しないので、イベントハンドラの追加方法を変更する必要があります。これを行うにはjqueryのからlive方法を使用してみてください:

<script type="text/javascript"> 
    $("#link1").click(function(){ 
     $.post("ajax.php", { act: "load" }, 
     function(data) { 
      $("#content").html(data); 
     }); 
    }); 

    $("#button1").live('click', function(){ 
     alert('test'); 
    }); 
</script> 

これは、すぐに彼らは文書で「ライブ」になると、一致する要素にイベントハンドラをアタッチします。その他の情報:http://api.jquery.com/live/