Question

如何在javascript中提交表单并防止默认

直到现在我的html表单（id =＆＃34; contact_form＆＃34;）有一个<input id="contact_send_msg" type="submit" value="Send" name="submit">，当它被点击时，我会在js中使用以下代码正确捕获它：

$(document).ready(function()
{
    $("#contact_form").submit(function(e)
    {
        e.preventDefault();
        $.ajax(
        {
            type: this.method, 
            url: this.action, 
            data: new FormData(this), 
            processData: false, 
            contentType: false, 
            success: function (data) 
            {
                if(data.localeCompare("got your message") === 0)
                {
                    alert(data);
                    window.location = "index.php";
                }
                else
                {
                    alert('Something went wrong, try again later');
                    alert(data);

                }
            }
        });

    });
});

但是，为了添加recaptcha，我替换了

<input id="contact_send_msg" type="submit" value="Send" name="submit">

带

<button class="g-recaptcha" data-sitekey="my key" data-callback="onSubmit">Submit</button>

所以我认为使用以下代码我可以获得相同的结果，但它不会进入$("#contact_form").submit(function(e){

function onSubmit()
{
    alert("it is inside1");
    $("#contact_form").submit(function(e)
    {
        alert("it is inside2");
        e.preventDefault();
        $.ajax(
        {
            type: this.method,
            url: this.action,
            data: new FormData(this),
            processData: false,
            contentType: false,
            success: function (data)
            {
                if(data.localeCompare("got your message") === 0)
                {
                    alert(data);
                    window.location = "index.php";
                }
                else
                {
                    alert('Something went wrong, try again later');
                    alert(data);
                }
            }
        });
    });
}

Answer 1

我通过执行以下操作来修复它，但我确信有更好的方法

function onSubmit()
{
    $("#contact_form").submit();
}

$(document).ready(function()
{
    $("#contact_form").submit(function(e)
    {
      //alert("enterededde");
        e.preventDefault();
        $.ajax(
        {
            type: this.method,
            url: this.action, 
            data: new FormData(this), .
            processData: false, 
            contentType: false, 
            success: function (data)
            {
                if(data.localeCompare("Got your message") === 0)
                {
                    alert(data);
                    window.location = "index.php";
                }
                else
                {
                    alert('Something went wrong, try again later');
                    alert(data);
                }
            }
        });

    });
});

如何在javascript中提交表单并防止默认

1 个答案: