我不能在分页后调用onclick事件

我使用http://datatables.net/

他们主页上的演示表与我使用的几乎完全相同(特别是分页)，除了每一行都有一个点击区域:

<a href="#" class="show-post"><%= Post.title %></a>

这个链接打开一个jquery UI模态对话框，其中显示一些ajax请求的信息。

第1部分(已解决)，参见下面

我试图运行一个在第一页正常工作的onclick事件，但只要我去到第2页(或任何其他)它停止工作。我检查了源代码，以确保它没有做任何有趣的事情，所有的代码都在那里(所有的行，甚至那些隐藏的分页)

任何想法?

$(function() {
    $('#dialog').dialog({
        autoOpen: false,
        resizable: false,
        maxHeight: 600,
        width: 650,
        modal: true,
        beforeClose: function close() {
            $('#dialog').html('');
        }
    });
    $('.show-post').click(function() {
        clickLink(this);
        return false;
    });
});

感谢那些回答我问题的人!我修复了这个问题。

我想要开始工作的下一个"问题"是……我使用左右箭头键来允许他们"扫描"到下一行或前一行，并显示信息。这是相对于关闭它，然后不得不点击下一个。

我想这样做，当你到达第一页的底部，或第二页的顶部，隐藏下一个/上一个分别将自动加载该页，到顶部(或底部)，然后打开对话框的那一行在另一个页面。

$(document).ready(function() {
    oTable = $('#posts').dataTable({
      "bJQueryUI": true,
      "iDisplayLength": 400,
        "bAutoWidth": false,
        "sPaginationType": "full_numbers",
        "aLengthMenu": [[-1, 400, 100, 50], ["All", 400, 100, 50]]
    });
    $(this).keydown(function(e) {
        var id = $("#dialog").attr("data-id");
        currentPost = $("#posts tr[data-id=" + id + "]");
        if (e.keyCode == 39 && $('#dialog').html() != "") {
            /* Remove current background */
            $(currentPost).blur()
            $(currentPost).removeClass("current");
            $(currentPost).find("td.sorting_1").removeClass("current");
            var next = currentPost.next().find(".show-post");
            clickLink(next);
        } else if (e.keyCode == 37 && $('#dialog').html() != "") {
            /* Remove current background */
            $(currentPost).removeClass("current");
            $(currentPost).find("td.sorting_1").removeClass("current");
            var prev = currentPost.prev().find(".show-post");
            clickLink(prev)
        }
    });
});

这里是实际的点击功能

function clickLink(src) {
var post = $(src);
var id = $(post).parent().parent().attr('data-id');
/* Set background for current line */
$(post).parent().parent().find("td.sorting_1").addClass("current");
$(post).parent().parent().addClass("current");
$('#dialog').attr("data-id", id);
$('#dialog').load('/show-post/' + id, function() {
    $.ajax({
        type: "POST",
        url:  "/checkstatus/" + id,
        dataType: "html",
        error: function(data){
            $("#dialog").fadeOut("fast", function() {
            $("#dialog").html("<img src='/img/invalid.jpg' alt='invalid' style='margin: 40px auto; display: block;'>").fadeIn("slow");
           });
        }
    });
    /* Set Visited */
    $(post).parent().parent().removeClass("visited").addClass("visited");
    $('#dialog').dialog({
        title: post.html(),
        beforeClose: function close() {
            $(post).parent().parent().find("td.sorting_1").removeClass("current");
            $(post).parent().parent().removeClass("current");
        },
        buttons: {
            "Email 1": function() {
                $.ajax({
                    type: "POST",
                    url:  "/get-email/" + id + "/" + "1",
                    dataType: "html",
                    success: function(data) {
                        window.location.href = data + "&subject=" + post.html();
                    }
                });
            },
        }
    });
    $('#dialog').dialog('open');
});
return false;
};