Question

我正在为每个textarea创建一个包含大量textareas和一个按钮的应用程序。如果用户编辑内容，则会将其保存到数据库中。单击该按钮时，将打开一个对话框，显示该特定区域内容的所有早期版本。这是由该对话框中的.html（）加载的。现在我想在该对话框中的每个早期版本上有一个按钮。单击该按钮时，此早期版本应复制到＆＃34; main＆＃34;的文本区域。站点。

我的问题：我无法使按钮工作，甚至没有警报。我哪里错了？

打开对话框，工作：

$( ".historydialog" ).click(function( event ) {
    var idhist = $(this).attr('id');
    $( "#dialog" ).dialog({
        open: function(event, ui) {
            $.get( "getLangHist.php", { idhist: idhist }, function( data ) {
                $( "#divInDialog" ).html( data );
            }); 
        },
        maxWidth:600,
        maxHeight: 500,
        width: 600,
        height: 500
    });
    event.preventDefault();
});

对话框中的按钮：

<button id="history-{id}" class="historybutton">

按钮操作，无效：

$(".historybutton").click(function( event ) {
    alert('test');
});

Answer 1

您提到您正在使用.html()

将内容添加到对话框中

这意味着您要将内容动态添加到DOM

如果是这种情况，那么您可以将click处理程序更改为：

$(document).on('click', '.historybutton', function(){
  alert('test');
});

这会将click处理程序绑定到动态添加的内容。

作为旁注。您可以使用"history-{id}"属性，而不是像data-那样使用分隔ID来控制您的控件。在查看代码时，它更加明显。

所以你的按钮就是：

<button data-history-id="123" class="historybutton">history</button>

然后，您可以使用jQuery中的data方法

来访问它

var hId = $('.historybutton').data('history-id');

Answer 2

试试这个

$("body").delegate('.historybutton','click',function( event ) {
    alert('test');
});

jquery对话框中的自己的按钮不起作用

2 个答案: