Question

我有一个jquery ajax调用，在div中加载一个表单，我想阻止提交这个表单，但如果我使用jquery提交函数

$("form").submit(function(e){
  e.preventDefault(e);
  alert('submit intercept');
});

如果我放在外部js文件中它不起作用，但如果我在通过ajax调用加载的表单后放入脚本标记，则无效。

Answer 1

您可以对动态生成的元素使用$(document)选择器和on()方法：

$(document).on('submit', 'form', function(e) {
    e.preventDefault();
    alert('submit intercept');
});

Answer 2

您不需要使用提交。

相反，你可以试试这个：

$('#submit-button').on('click', function() {
    var userId = $('#user-id').val();
    var content = $('#content').val();
    $.ajax({
        type : 'post', 
        url :'url',
        processData : false,
        cache : false,
        contentType : false,
        data : {
            'userId' : userId,
            'content' : content
        },
        dataType : 'json',
        success:function(result){
            alert('success!');
            var userId = $('#user-id').empty();
            var content = $('#content').empty();
        },
        error:function(e){
            console.log(JSON.stringify(e));
        }
    });
});

然而，你不需要＆＃39;形式＆＃39;标签了。因为如果要提交页面更改，如果要使用ajax，则异步不应更改页面。

阻止提交通过ajax

2 个答案: