Question

如果在查询字符串中设置了某些参数，我试图在页面加载时在页面上提交表单。表单使用ajax提交并且工作正常，并且查询字符串中的表单字段的预填充也很好，但无论我尝试自动提交表单，我最终都会在页面加载的无限循环中结束。

PHP

// top of page
<?php
    if (isset($_GET['postcode'])) {
        $postcode = trim($_GET['postcode']);
    } else {
        $postcode = '';
    }

    if (isset($_GET['phone_num'])) {
        $phone_num = trim($_GET['phone_num']);
    } else {
        $phone_num = '';
    }
?>

的jQuery

/* 
// causing infinite page loads
if ($('input[name="phone_num"]').val() != '' || $('input[name="postcode"]').val() != '') {
    $('#check').trigger("click");
    return false;
}
*/

$('form').submit(function() {
    $.get("script.php", $(this).serialize(), function(data){
        // process results
    }, "json");      
    return false;
});

HTML

<form class="navbar-form pull-right" action="" method="get">
    <input class="span2" type="text" name="phone_num" placeholder="Phone Number" value="<?php echo $phone_num; ?>">
    <input class="span2" type="text" name="postcode" placeholder="Postcode" value="<?php echo $postcode; ?>">
    <button type="submit" class="btn btn-primary" id="check">Check</button>
</form>

我没有使用click函数进行自动表单提交，而是尝试了同样的$('form').submit，但我遇到了同样的问题。我期待页面正常运行，这样如果设置了参数，那么将自动进行ajax调用，但显然情况并非如此。

Answer 1

在绑定提交事件之前，您将退出代码。删除if语句中的return false，然后将if语句移到提交绑定之后。

$('form').submit(function() {
    $.get("script.php", $(this).serialize(), function(data){
        // process results
    }, "json");      
    return false;
});

if ($('input[name="phone_num"]').val() != '' || $('input[name="postcode"]').val() != '') {
    $('#check').trigger("click");
    //return false;
}

Answer 2

<强> HTML

<form class="navbar-form pull-right" action="" method="get">
    <input class="span2" type="text" name="phone_num" placeholder="Phone Number" value="<?php echo $phone_num; ?>">
    <input class="span2" type="text" name="postcode" placeholder="Postcode" value="<?php echo $postcode; ?>">
    <input type="button" class="btn btn-primary" id="check">Check</button>
</form>

<强>的jQuery

$('#check').click(function(e) {
    e.preventDefault();
    $.get("script.php", $('form').serialize(), function(data){
        // process results
    }, "json");      
    return false;
});
if ($('input[name="phone_num"]').val() != '' || $('input[name="postcode"]').val() != '') {
    $('#check').trigger("click");
}

使用submit按钮时，您正在执行默认事件（提交表单）以及处理.click()事件的处理程序。为避免这种情况，请使用e.preventDefault();仅处理事件的脚本部分。

Answer 3

尝试这样的事情：

if($('input[name="phone_num"]').val() && $('input[name="postcode"]').val()) {
    $('form').submit(function() {
        $.get("script.php", $(this).serialize(), function(data){
            // process results
        }, "json");      
        return false;
    }).submit();
}

Answer 4

在代码中使用此行。

$('form').trigger("submit");

如果设置了GET参数，则jQuery触发器表单在页面上提交

4 个答案: