Question

你们可以帮我调试为什么我的jquery点击事件无效。

$(function(){
  displayBooks();

   $(".btn_checkout").click(function(){
    //checkOutBook(event.target.id);
    alert('got in here');
  });
});


function checkOutBook(id)
{
  alert('Checkout book id ' + id);
}

function displayBooks(){
  var url = 'http://portal.internal.urs.org/tools_services/training_library/_vti_bin/listdata.svc/Book?$expand=CheckedOutTo';
  var books = new Array();
  $.getJSON(url, function(data){
    for (var i = 0; i < data.d.results.length; i++){
        var book = data.d.results[i];
        books[i] = book;
        var s = '<tr><td>' + book.Title + '</td>';

        if (book.CheckedOutTo != null){
          s += '<td>' + book.CheckedOutTo.Name + '</td>';       
        } else {
          s += '<td> <button class="btn_checkout" type="button" id="'+book.Id+'">Check Out</button></td>' 
        }
        s += '</tr>';
    $('.LibraryTable').append(s);
    }
  });

  return books;
};

警告'got in here'不会提醒。

感谢。

Answer 1

您需要在父级

级别附加事件

$('.LibraryTable').on("click",".btn_checkout",function ()...

Answer 2

function displayBooks(){
  var url = 

    'http://portal.internal.urs.org/tools_services/training_library/_vti_bin/listdata.svc/Book?$expand=CheckedOutTo';
      var books = new Array();
      $.getJSON(url, function(data){
        for (var i = 0; i < data.d.results.length; i++){
            var book = data.d.results[i];
            books[i] = book;
            var s = '<tr><td>' + book.Title + '</td>';

            if (book.CheckedOutTo != null){
              s += '<td>' + book.CheckedOutTo.Name + '</td>';       
            } else {
              s += '<td> <button class="btn_checkout" type="button" id="'+book.Id+'">Check Out</button></td>' 
            }
            s += '</tr>';
        $('.LibraryTable').append(s);
        }
      }); //remove  this

单击事件未被调用

2 个答案: