人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

下記のようなソースで、jqueryで動的に追加した要素に対してクリックイベントを設定しました。

ところが、このようにすると、追加したliをクリックしたときに、
なんかいも$.getが発生してしまいます。
liクリックした要素のみ$.getすればいいのですが、どのようにしたらよいでしょうか。

$.get("/api/bt?l="+$(this).children('input').val(), function(data){
$("#bM").html(data);
$(document).on('click', 'ul#bM li a', function(){
$.get("/api/bt?l="+$(this).children('input').val() +
"&m="+$(this).children('input').val(), function(data){
$("#bS").html(data);
});
});
});

●質問者: FujiiRock
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● typeof_the_end
●100ポイント

うーん、これで合っているかは分かりませんが、こういう感じでしょうか?
http://nullppon.net/test/

何かのヒントとなればいいのですが。


ソースコードは以下のような感じです。

[JavaScript]
$(function(){
  $(document).on('click', '#items li', function(){
    $.get('bs.php', {
      l: $(this).children("input[name='l']").val(),
      m: $(this).children("input[name='m']").val()
    }, function(data){
      console.log(this);
      $('#output').after('<p>'+data+'</p>');
    });
  });

  //要素追加
  $('#add').click(function(){
    $("#items").append('<li><a href="javascript: void(0);">'+$('input[name="ll"]').val()+' | '+$('input[name="mm"]').val()+'</a><input type="hidden" name="l" value="'+$('input[name="ll"]').val()+'"><input type="hidden" name="m" value="'+$('input[name="mm"]').val()+'"></li>');
  });
});


[HTML]
<input type="text" name="ll" value="(`・ω・´)">
<input type="text" name="mm" value="キタ――(゚∀゚)――!!">
<input type="button" id="add" value="ADD">
<ul id="items">
  <li><a href="javascript: void(0);">Σ(゚◇゚;)マジデッ!? | (´・ω・`)</a><input type="hidden" name="l" value="Σ(゚◇゚;)マジデッ!?"><input type="hidden" name="m" value="(´・ω・`)"></li>
</ul>
<div id="output"></div>


[PHP]テスト用なので悪しからず
<?php
if(isset($_GET['l'])){
  $l = $_GET['l'];
  echo $l;
}
if(isset($_GET['m'])){
  $m = $_GET['m'];
  echo $m;
}
?>


FujiiRockさんのコメント
ありがとうございます!!確認してみます!
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ