動態L1標籤內按鈕onclick事件沒有定義

Question

我試圖調用按鈕onClick事件的功能，這是目前的L1標籤內，但輸出 - 的ReferenceError：函數名（deleteUser）沒有定義？

$(document).ready(function(){ 
    var baseUrl = 'http://localhost:9000/'; 
    $('#btnUserList').click(function(){ 
     $.post(baseUrl+'listUsers',function(data){ 
      $(".listUl").empty(); 
      for(var i in data){ 
       $("#userRecord ul").append('<li><input type="text" size="8" value='+i+'>'+ 
        '<input type="text" size="8" value='+data[i].firstName+'>'+ 
        '<input type="text" size="8" value='+data[i].lastName+'>'+ 
        '<input type="text" size="8" value='+data[i].username+'>'+ 
        '<input type="text" size="8" value='+data[i].email+'>'+ 
        '<input type="button" value="Delete" onClick="deleteUser('+data[i].username+')"></li>'); 
      } 
     }); 
    }); 
function deleteUser(username){ 
    alert(name); 
    $.post(baseUrl+'deleteUser',username,function(result){ 
     if(result == 'yes'){ 
      $('#btnUserList').trigger("click"); 
       alert('User Deleted'); 
       } 
      }); 
     } 
}); 

Answer 1

功能deleteUser是document.ready處理程序，這意味着它不是在全局範圍內定義。你必須定義它的document.ready處理

$(document).ready(function() { 
    var baseUrl = 'http://localhost:9000/'; 
    $('#btnUserList').click(function() { 
     $.post(baseUrl + 'listUsers', function(data) { 
      $(".listUl").empty(); 
      for (var i in data) { 
       $("#userRecord ul").append('<li><input type="text" size="8" value=' + i + '>' + 
        '<input type="text" size="8" value=' + data[i].firstName + '>' + 
        '<input type="text" size="8" value=' + data[i].lastName + '>' + 
        '<input type="text" size="8" value=' + data[i].username + '>' + 
        '<input type="text" size="8" value=' + data[i].email + '>' + 
        '<input type="button" value="Delete" onClick="deleteUser(' + data[i].username + ')"></li>'); 
      } 
     }); 
    }); 
}); 

function deleteUser(username) { 
    alert(name); 
    $.post(baseUrl + 'deleteUser', username, function(result) { 
     if (result == 'yes') { 
      $('#btnUserList').trigger("click"); 
      alert('User Deleted'); 
     } 
    }); 
} 

外面或者你可以創建使用jQuery的元素，而不是

$(document).ready(function() { 
    var baseUrl = 'http://localhost:9000/'; 
    $('#btnUserList').click(function() { 
     $.post(baseUrl + 'listUsers', function(data) { 
      $(".listUl").empty(); 
      $.each(data, function(index, item) { 
       $("#userRecord ul").append(
        $('<li />').append(
         $('<input />', {text : 'text', size : '8', value : index}), 
         $('<input />', {text : 'text', size : '8', value : item.firstName}), 
         $('<input />', {text : 'text', size : '8', value : item.lastName}), 
         $('<input />', {text : 'text', size : '8', value : item.username}), 
         $('<input />', {text : 'text', size : '8', value : item.email}), 
         $('<input />', { 
          type : 'button', 
          value : 'Delete', 
          on : { 
           click : function() { 
            $.post(baseUrl + 'deleteUser', item.username, function(result) { 
             if (result == 'yes') { 
              $('#btnUserList').trigger("click"); 
              alert('User Deleted'); 
             } 
            }); 
           } 
          } 
         }) 
        ) 
       ) 
      }); 
     }); 
    }); 
});