0

私はJqueryが初めてです。私は、Jquery と AJAX でいくつかの基本的な機能を実行し、その場で HTML を生成しようとしています。しかし、「$(document).ready(function ()」では機能しません。

$(function () 
{
 $.ajax({ 
  type: "POST",                                     
  url: 'api.php',                  //the script to call to get data          
  //data: { id:2 },                  //you can insert url argumnets here to pass to api.php
                                   //for example "id=5&parent=6"
  dataType: 'json',                //data format      
  success: function(data)          //on recieve of reply
  {
    $('#root').append('<div id="try"></div>');
    for(var i = 0; i < data.length; i++)
    {
      var cssId = 'writings'+ i;
      var id  = data[i][0];
      var name = data[i][1];
      //$('#root').append("id: "+id); //Set output element html
      $('#try').append('<div class="names" id="'+cssId+'">'+name);
      $('#'+cssId).append('<a href="#" class="edit" id="img1"><img src="img/edit.png"></a>');
      $('#'+cssId).append('<a href="#" class="delete" id="img2"><img src="img/delete.png"></a>');
      $('#try').append('</div>');
    }
  } 
 });
});

$(document).ready(function () {
$('#img1').on('click', function() {
$(this).remove();
});
});

コードの最初のブロックでは、次のような html を生成しています [1]: http://postimg.org/image/nphmjutlz/ "screenshot". しかし、編集または削除ボタンをクリックしても機能しません。私のコードによると、削除する必要があります。

前もって感謝します。

4

1 に答える 1

2

これを使用します(document.readyの外側):

$(document).on('click','#img1', function(){
   $(this).remove();
});

これは、要素 (この場合は #img1) をいつ作成しても問題なく機能します。

$('#img1').on('click', ..... の前に #img1 が存在する場合にのみコードが機能します

于 2013-05-25T02:36:59.367 に答える