2012-12-09 28 views
1

我在動態生成的表格中難以製作可點擊的按鈕,該表格會向特定於點擊的表格單元格發送數據。在動態生成表格後點擊JavaScript函數時很難調用

我的表中生成和修改,每當用戶類型與此AJAX調用搜索框:

 $(document).ready(function(){ 
     $("#data").keyup(function() { 
      $.ajax({ 
       type: "POST", 
       dataType: "JSON", 
       data: "data=" + $("#data").val(), 
       url: "search1.php", 
       success: function(msg){ 
        var output = ""; 
        for(var i = 0; i < msg.length; i++) { 
         output += '<tr onmouseover=this.style.backgroundColor="#ffff66"; onmouseout=this.style.backgroundColor="#F0F0F0";>'; 
         output += '<td>'; 
         if (msg[i].website != ''){ output += '<a href = ' + msg[i].website + ' target = "_blank">' + msg[i].name + '</a></td>';} 
         else output += msg[i].name + '</td>'; 
         output += '<td class="description">' + msg[i].description + '</td>'; 
         output += '<td><input type="button" onclick=' + submit() + ' value=' + msg[i].id + '></td></tr>'; // Here is where I'd like to put in a clickable button 
        } 
        $("#content").html(output); 
        $("#myTable").trigger("update"); 
       } 
      }); 
     }); 
    }); 

如果我讓submit()只是alert("hello")當頁面加載的onclick呼叫的每個實例運行到submit()。有人可以向我解釋如何使提交只在按鈕被點擊時被調用,而不是在頁面加載時被調用。提前致謝。

+0

我不明白...按鈕按下時應該調用'submit'函數嗎? – rdiazv

回答

1

您試圖分配submit()到該按鈕的onclick,但你實際上是在調用函數時你生成字符串output。它需要在字符串引號內,而不是在串聯。

output += '<td><input type="button" onclick="submit()" value="' + msg[i].id + '"></td></tr>'; 
//----------------------------------------^^^^^^^^^^^^ 

一個更好的策略是離開了onclick全部屬性,並使用jQuery的.on()動態分配的方法。通常認爲動態綁定事件而不是將它們硬編碼爲HTML屬性是更好的做法。

// No onclick attribute in the string: 
output += '<td><input type="button" value="' + msg[i].id + '"></td></tr>'; 

// And a call to .on() in the $(document).ready() 
$('input[value="'+msg[i]+'"]').on('click', function() { 
    submit(); 
}); 
+0

這工作,感謝您的快速反應! –

2

您必須將submit()調用放在帶引號的字符串中。 msg [i] .id也一樣。應該引用HTML中的所有值。

output += '<td><input type="button" onclick="submit()" value="' + msg[i].id + '"></td></tr>'; 
+0

這工作,謝謝你! –

+0

沒問題!如果它解決了你的問題,請接受這個答案。 – danronmoon

相關問題