IT邦初學者
8級

jQuery 中 html()所產生的按鈕，無反應

轉寄

列印
檢舉

<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$('document').ready(function() {
    $('#test').click(function() {
        $('#test').html('<input type="button" value="測試" class="cancel"/>');
    });
    $('.cancel').click(function() {
        alert('cancel');
    });
});
</script>
</head>
<body>
<div id='test'>123</div>
</body>

用html()產生的button，不會執行click中的程式
請問大家有解決的辦法嗎

</html>漏掉了^^"
感謝wordsmith，你的方法我試成功囉

不好意思再補充一個問題
假如我在第7行後補充一個指令
$('#test').addClass('edit');
又在第10行後補充一行
$('#test').removeClass('edit');

這樣一來，removeClass() 似乎又沒辦法移除class
煩請大家指點一下，謝謝

於 2008-10-09 11:27:21 補充

不好意思，要參照wordsmith的程式才對
第3行後加一行
$('#test').addClass('edit');

第5行後加一行
$('#test').removeClass('edit');

於 2008-10-09 11:29:50 補充

收到書籤：

解決時間：2008-10-22 16:11:42

發問時間：2008-10-08 16:53:03

▼ ADVERTISEMENT ▼

最佳解答(發問者自選)

7人

回答：wordsmith ( IT邦好手9級 )

時間：2008-10-08 17:45:36

你的情況的話，將註冊.cancel事件放進#test註冊click的event中，應該就可以work了

寫法如下:

$('document').ready(function() {   
    $('#test').click(function() {   
        $('#test').html('<input type="button" value="測試" class="cancel"/>');   
        $('.cancel').click(function() {   
            alert('cancel');   
        });  
    });   
});

(ps.你的範例中，最後少了</html>，應該是copy&paste掉的吧)

2008-10-09 17:57:14補充
會這樣是因為按下按鈕時，又觸發了div#test的click事件，所以把remove掉的class又加了回來，請看討論中的詳細說明。

[-隱藏]