作者sabiya (别赤脚走路)
看板Ajax
标题Re: [问题] 关於jQuery的html()和apend()
时间Fri Apr 27 12:58:40 2012
首先感谢版大详细回答，
还有版友的回答，
深刻了解到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