jquery - 在删除按钮之前捕获按钮？

Question

我创建了一个 jsfiddle，因为我认为这将是显示问题的最佳方式。基本上，脚本可以改变按钮，但是按钮改变后，标题不会改变。我假设这是因为原始按钮已被替换：

http://jsfiddle.net/cEu8f/5/

是否有可能以某种方式捕获原始按钮，以便即使在删除按钮后也可以使用它来删除替换标题？

Answer 1

您可以缓存outer_div元素（示例）；

$('#some_button').live('click', function() {
    some_function( $(this) );
});

function some_function( that ) {
    var $outer_div = that.closest('.outer_div');

    $outer_div
        .find('.main')
        .empty()
        .append( '<input type="button" id="some_other_button" value="click me 2" />' )
        .end()
        .find('.header')
        .empty()
        .append( "new header data" );
}

还要注意.end()功能。;)

Answer 2

尝试更改您的功能，如下所示，

function some_function( that ) {
    var $outerDiv = that.closest('.outer_div');
    $outerDiv.find('.main').empty().append( '<input type="button" id="some_other_button" value="click me 2" />' );    
    $outerDiv.find('.header').empty().append( "new header data" );
}

演示

Answer 3

发生这种情况是因为that当您从 DOM 中删除它时元素不再存在。但是，您可以“缓存”父div元素。

function some_function( that ) {
    var div = that.closest('.outer_div');
    div.find('.main').empty().append( '<input type="button" id="some_other_button" value="click me 2" />' );     
    div.find('.header').empty().append( "new header data" );
}​

演示：http: //jsfiddle.net/cEu8f/7/