javascript - 如何从无处提交按钮？

Question

我正在制作一个新的数据表，其中有这样的功能，我可以 extend a row如果有人按下它:

// Add event listener for opening and closing details
$('#datatable-buttons tbody').on('click', 'tr', function(){
    var tr = $(this);
    var row = a.row( this );


    if(row.child.isShown()){
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    } else {
        row.child(format(row.data())).show();
        tr.addClass('shown');
           }
});

所以，如果有人在延长线上按下了一个按钮，我无法听到:

$('#datatable-buttons tbody').on('click', 'td button', function(){
    var tr = $(this);
    var row = a.row( this );

但是我已经尝试了 100 种方法来提交此行的表单，但没有任何效果。

这是一个扩展一行的简单函数:

function format ( d ) {
    var editform = '<form> ... <button type="submit" class="btn 
    btn-primary mb-2" >Submit</button></div> </div></form>';

    return editform; 
}

所以，现在我只能在按下按钮时收听它，但我不知道如何获取这些数据并提交表单。

再一次: 1. 数据表有行但没有任何按钮。 2. 如果您按下任何一行 - 它将扩展并显示其详细信息(将出现该行下方的新区域)。 3.是这个区域的表格。 4.提交不了。

更新:jsfiddle 您可以看到按任意行并提交按钮时出现的问题。因此，您可能会收到警报，但不会收到表单数据。

Answer 1

从您的 JSFiddle 代码和评论来看，您似乎试图抑制表单提交，以便使用 AJAX 请求来提交数据。但是，您通过尝试修改表单标记的“action”属性来完成此操作，并在这样做时引入了语法错误。

虽然您可以使用此技术，但这不是推荐的方法，并且确实存在一些缺点。最好使用标准的 jQuery(委托(delegate))事件处理程序来处理表单的“提交”事件:

$('#table_id tbody').on('submit', 'form', function(event) { 
  event.preventDefault(); 
  //...and then your AJAX code goes here
});

event.preventDefault 将停止常规表单提交，以便您随后可以运行 AJAX 代码。

这是您的 JSFiddle 的改编版本，展示了它的实际效果:https://jsfiddle.net/moa1nr9j/