作者anawak (...)
看板Ajax
標題Re: [問題] post之後，function無作用
時間Wed Mar 12 17:20:56 2014
我發現問題有好幾個地方。不過終於解決了。
1. jquery版本
看了原始碼之後，影片作者使用的是 jquery 1.6。
我自己剛下載的jquery 是1.11.0.min.js。
但是 jquery 1.7 之後，live 函數要改用 on
2. 為什麼要用 live 或 on？
這一頁的範例是，有一個文字欄位，輸入文字後確認，
內容會即時出現在下方的列表，並且附帶一個刪除連結。
按下刪除連結後，要可以即時刪除這個元素。
注意，這些動作沒有重整頁面。
如果沒有加 live ，只有原本已存在的記錄可以刪除，
但是剛剛才透過ajax新增、未重整頁面的記錄，無法刪除。
示意圖：
┌───┐
└───┘ 確認按鈕
aaa X
bbb X
ccc X
asdf X
hahaha X
yayaya X
3. 下面這是原作者提供下載的原始碼，使用 jquery 1.6
$('.del').live('click', function() {
delItem = $(this);
var id = $(this).attr('rel');
$.post('dashboard/xhrDeleteListing', {'id': id}, function(o) {
delItem.parent().remove();
//alert(1);
}, 'json');
return false;
});
但是把 live 改成 on 也不行~，把json 拿掉也不行。
最後發現要這樣：
這一行
$('.del').live('click', function() {
改成這樣：
$('
#listInserts').on('click', '.del', function(o){
這是影片底下某個留言講的。
(listInserts是包含全部列表的div。)
原作者的官網：
http://jream.com/lab
完整的原始碼：下載 Part 4 那個 Download
--
※ 發信站: 批踢踢實業坊(ptt.cc)
※ 編輯: anawak 來自: 61.231.90.162 (03/12 17:39)