Question

我是JS的新手，我正在尝试做一些简单的事情，但我做不到。

我创建了一个数据表，最后一列有按钮，但是当我单击它们时，什么也没有发生。

单击按钮后，我的数据表会收费。（btn-搜索）

谢谢。

$(document).ready( function () {
$('#btn-search').on('click', function() {

        $.ajax({
                type:        "GET",
                url:"{{myurlapi }}",
                }).done(function (result) {
                    var table = $('#example').DataTable( {
                    "data":result.data,
                    "columns": [
                            { "data": "id"  },
                            { "data": "name" },
                            { "data": null }
                        ],
                    "columnDefs": [
                        { "searchable": false,
                          "orderable": false,
                          "targets": 0
                        },
                        { width: '3%',
                          targets: 0
                        },
                        { targets: -1,
                          data: null,
                          defaultContent: '<div class="btn-group"> <button type="button" class=" btn btn-view"><span> <i class="icon-plus"></i></span> </button></div>'
                        },
                                   ],
                    "processing": true,
                    "retrieve": true,
                    "searching": false
            } );
              table.clear().draw();
              table.rows.add(result).draw();
            });
    });

             $('#example tbody').on('click', '.btn-view', function (e) {
                   alert('something')
     } );


});

<div class="col-6">
            <button id='btn-search' class="btn btn-primary px-4">Search</button>
          </div>

<div class='card-body'>
                <table id="example"
                        class="table text-right table-bordered table-striped nowrap"
                        width="100%">
                 <thea

<!-- begin snippet: js hide: false console: true babel: false -->

Answer 1

您过早地调用on.click事件。如果您在dom加载时触发它，则仅适用于DOM中已存在的按钮。您以后添加的任何内容（添加，替换任何内容）都不会触发on.click事件。

尝试--

new GooglePlayAppVersion(getPackageName(), version -> 
    Log.d("TAG", String.format("App version: %s", version)
).execute();

Answer 2

我认为您缺少的是单击事件绑定到页面加载时不在表上的元素。加载数据时，包含按钮的列将被加载，但仍然缺少它们上的click事件。

请read this link告诉您如何在完成表加载时添加事件。

在javascript中，当您放置选择器时，除非将其放置在“监视dom的代码”中，否则它只能应用于已加载的元素。在您的情况下，您无需一直监视DOM，因为一旦将按钮加载到DOM中，它就可以在控件中运行代码。

如果使用initComplete函数中提到的上述技术，则可以对其进行调试。我没有在这里复制示例，因为在该链接上已经提到了它们，但是有很多方法可以检查表中加载的数据，我建议使用库提供的方法，以便将来您可以更新数据表和其他库而没有任何问题。 / p>

数据表中的按钮

2 个答案: