Question

大家晚上，

我有一个简短的问题，我希望这是可能的。

我有一个用于从数据库中删除记录的页面。

我有一个删除按钮，可以完成我需要的操作。我想在单击删除按钮时将div滑下，以确认要删除的内容。

我可以很好地滑下来并添加文字。

这是我到目前为止所做的：

$('#delete').on('click', function()
{
    $('#info').slideDown();
    $('#info').html('Really delete <?php echo $aid; ?>?');
    $('<br/><br/><input type="button" value="Sure" id="sure">').appendTo('#info');
});

$('#sure').on('click', function(e)
{
    e.stopPropagation();
    alert('Goodbye <?php echo $aid; ?>?');
});

我想要一个id肯定会在点击时触发事件的按钮。我可以显示按钮，然后点击它，但点击时不会触发任何内容。

我在查看this question

时添加了停止传播

我做了一个快速的谷歌，似乎没有什么适合我需要做的事情。这件事真的很简单吗？或者它是不是可以做的事情？

此外，这是我表格的基本要点：

<form name="..." action="..." method="...">

    // form content

    <input name="delete" type="button" id="delete" value="Delete" tabindex="23"/>

    <div id="info"></div>

</form>

这是fiddle for it

TIA

Answer 1

您需要委派活动。

$(document).on('click', '#sure', function(e)
{
    e.stopPropagation();
    alert('Goodbye <?php echo $aid; ?>?');
});

查看更新的小提琴：http://jsfiddle.net/A8S5W/1/

Answer 2

我相信，您遇到的问题是，在设置点击监听器时，确认按钮不存在。我有两种方法可以想到解决这个问题：

在您的删除侦听器功能中移动确认侦听器功能。

$('#delete').on('click', function(){
    $('#info').slideDown();
    $('#info').html('Really delete <?php echo $aid; ?>?');
    $('#info').append("<br/><br/><button value='Sure' id='sure'>");
    $('#sure').on('click', function(e){
        alert('Goodbye <?php echo $aid; ?>?');
    });
});

更改确认侦听器以侦听文档

$('#delete').on('click', function(){
    $('#info').slideDown();
    $('#info').html('Really delete <?php echo $aid; ?>?');
    $('<br/><br/><button value="Sure" id="sure">').appendTo('#info');
});

$(document).on('click', '#sure', function(e){
    alert('Goodbye <?php echo $aid; ?>?');
});

第二种方法有点严重，因为整个文档的听众效率很低。第一个有点严重，因为嵌套大量的jQuery只是要求打破一些东西。但是，他们都应该工作。

此外，您不应该停止事件传播，因为无论如何该按钮上没有任何事件。

在jQuery showable div中的按钮

2 个答案: