jq在添加a鏈接時綁定事件，在方法中獲取表格中的信息

做個筆記，以防忘記。新手一個，歡迎補充。

需求：

通過ajax後臺獲取json格式數據，添加到table中，每條數據後面加添加、刪除和修改功能。添加和修改用模態框實現。

遇到的問題：

在點擊修改的時候如何獲取該條用戶的信息，顯示在模態框的相應input中

解決辦法（三種）：

1.方法一（推薦）：

在生成表格的時候給修改的鏈接上添加一個屬性(如userID=userId),然後給鏈接上綁定方法，在方法中獲取ID，用ajax訪問後臺查詢數據顯示在模態框裏。

例子

//給表格添加ID

<tbody id="appList">
</tbody>

//ajax請求數據並添加到table裏

$.get("../../../admin/findAllApp", { username: "", password: ""},
    function(data){
        var obj = JSON.parse(data); 
        var list="";
        for(var i=0; i<obj.length; i++){
        list=list+"<tr><td>"+obj[i].id+"</td><td>"+obj[i].appId+"</td>"
             +"<td>"+obj[i].appSecret+"</td>"
                 +"<td>"+obj[i].url+"</td>"
                 +"<td>"+obj[i].appDate+"</td>"
                +"<td>"
                +"<a href='../../../admin/deleteApp?id="+obj[i].id+"'>刪除</a>"
                +"<a onclick='func(this.id)' id='"+obj[i].id+"' data-toggle='modal' class='btn btn-primary btn-large' id='change'>修改</a>"         
                +"</td></tr> "
         }
         $("#appList").html(list);
});

//當點擊修改時觸發函數func（）

function func(a){
    $.get()//方法後臺獲取數據添加到模態框中
    $("#myModal").modal('show');//顯示模態框
}

方法二（也推薦）：

類似方法一，在生成表格的時候給修改的鏈接上添加所有需要的內容(如userID=userId，username=username),然後給鏈接上綁定方法，在方法中獲取所需的值

//與方法一類似，不同之處

+"<a onclick='func(this)' id='"+obj[i].id+"' appId='"++"' data-toggle='modal' class='btn btn-primary btn-large' id='change'>修改</a>" 

//點擊事件

function func(a){
    this.id     //獲取id值
    this.appId  //獲取appId
    //添加到模態框中（略）
    $("#myModal").modal('show');//顯示模態框
}

方法三：

鏈接上綁定方法，傳遞this，通過獲取其父標籤和兄弟標籤獲取所需的參數

//獲取數據和方法一一樣

//綁定的方法

function func(a){
    //.parent()取其父標籤；.prev()取其上一個兄弟標籤
    $("#"+a).parent().prev().prev().text()
    //添加到模態框中（略）
    $("#myModal").modal('show');//顯示模態框
}

雖然方法有點笨，但總歸能實現功能（笑臉）