0

我正在尝试创建一个动态表,一旦单击行,它应该在另一个表中显示更多信息。

我是根据我一年前写的一些代码来做这个的,在那里我使用了 jQuery live 方法。截至目前,此方法已不存在,我切换到 on 方法。

现在,问题是,虽然这段代码实际上触发了 Datatable 的创建,但它不会绑定行上的 click 事件。当我点击它时,什么也没有发生。

这是负责的 Javascript 代码:

<script type="text/javascript">
$(document).ready(function() {
    $("#overview").dataTable({
        aoColumnDefs:[{
            sWidth: "20px",
            aTargets: [0]
        }],
        bLengthChange: false,
        oLanguage: {
            sProcessing:   "Bitte warten...",
            sLengthMenu:   "_MENU_ Einträge anzeigen",
            sZeroRecords:  "Keine Einträge vorhanden.",
            sInfo:         "_START_ bis _END_ von _TOTAL_ Einträgen",
            sInfoEmpty:    "0 bis 0 von 0 Einträgen",
            sInfoFiltered: "(gefiltert von _MAX_  Einträgen)",
            sInfoPostFix:  "",
            sSearch:       "Suchen",
            oPaginate: {
                sFirst:    "Erster",
                sPrevious: "Zurück",
                sNext:     "Nächster",
                sLast:     "Letzter"
            }
        },
        iDisplayLength: 10,
        sAjaxSource: "<%=ivy.html.startref("API/WebAPI/antraege.ivp")%>?asUid=<%=ivy.html.get("in.asUid")%>"
    });

    $(".dataset").on("click", function() {
        antragid = this.id;

        $.ajax({
            url: "<%=ivy.html.startref("API/WebAPI/antrag.ivp")%>",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: {
                id: antragid
            },
            success: function(data) {
                for (var key in data) {
                    $('#'+key).html(data[key]);
                }
            }
        })
    })
})
</script>

现在,因为我在使用模板的工作流工具上使用它,所以我不能将此代码放入标题中(否则它将被加载到使用此模板的每个页面上),所以我被迫放到body标签里面,不知道会不会影响这个问题。

现在,奇怪的部分来了:当我复制上面的代码并在 Chrome JS 控制台中执行它时,它确实创建了事件绑定,以便将详细信息放入另一个表中。

难道我做错了什么?使用 live 方法的应用程序仍然可以正常工作。

谢谢

4

1 回答 1

2

您需要将 on 事件委托给最接近的静态父元素....以便单击以在动态添加的元素中工作

尝试这个

 $(document).on("click",".dataset",function() {
 .....

#overview将其委派给文档工作..但是如果您可以将其委派给调用单击时文档中存在的最接近的父级(我猜是您的情况),那就更好了..

更多关于on()委托事件

于 2013-03-21T10:08:44.550 回答