Re: [問題] 關於jQuery的html()和apend()

看板Ajax作者 (別赤腳走路)時間13年前 (2012/04/27 12:58), 編輯推噓0(000)
留言0則, 0人參與, 最新討論串3/4 (看更多)
首先感謝版大詳細回答, 還有版友的回答, 深刻了解到html()和append()的差異。 但是其實在我post callback function最後面, 除了把<tr>插進來外, 我是有去把所有的button event handler都移除, 再對所有的button加上click event handler, 這樣是不是無論是使用html()或append()都會把event handler bind給所有button? $.post('admin_polling.php', {method:'polling', docID:docNum, marketID:marketNum, dealID:dealNum}, function(data){ var trHtml = '<tr><td>xxxxx</td> <td> <button title="doc" class="cancel">結案 </button> </td> </tr>'; var table = $('#content table'); table.append(trHtml); $("button").off(); $('button').click(clickBtn); setTimeout("polling()",10000); },'json'); ※ 引述《TonyQ (自立而後立人。)》之銘言: : ※ 引述《sabiya (別赤腳走路)》之銘言: : 這整件事情的問題在於一樣的 HTML 並不代表一樣的 JS instance , : 就你的 case 而言,這兩者的確不是等價的。 : 其實板友講 live / delegate / on(selector,deletagor,fn) 都是對的, : 只是他們跳過問題的本質直接進入解法,所以你會覺得不明白也是正常的。 : 用文字解釋起來可能會有點複雜,我直接舉個例子應該就比較清楚。 : <div id="container"> : <div> : <button id="hi" >hi</button> : </div> : </div> : <script> : var node = $("#hi")[0]; : node.click(function (){ alert( "hi" ;)}); : $("#container").html($("#container").html()); : //the html is replaced , so the event need to bind again. : </script> : ----------------------------------- : 這裡有個複雜一點的例子,看完應該會比較明白。 : http://jsfiddle.net/Ey3uZ/ : ----------------------------------- : 至於 live 跟 delegate 的確是解決這個問題的方法之一, : 詳細你可以再翻翻文件看看為什麼, : 但更重要的你得要先了解為什麼東西不會動了。 : 而 append 因為只在之後新增元素,而非換掉原本的元素,所以就沒有問題。 : ----------------------------------- : 同樣的,即使不以 jQuery 操作,而以 innerHTML/outerHTML 在做操作時, : 也要特別小心這個問題,如這個例子。 : http://jsfiddle.net/Ey3uZ/1/ : 把 : $("#container").html($("#container").html()); : 換成 : $("#container")[0].innerHTML = $("#container")[0].innerHTML; : 也會有一樣的問題。 : 大概簡要描述一下,有不了解的地方可以再問~ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 60.249.161.162
文章代碼(AID): #1FcYU3v5 (Ajax)
討論串 (同標題文章)
文章代碼(AID): #1FcYU3v5 (Ajax)