Question

我正在尝试用jquery为我的php表单执行两个不同的javascript操作，它有两个提交按钮：'save'和'next'。这个想法是两个按钮都提交了将数据保存到db中的形式，但是“next”通过客户端验证并进一步进展，“save”只是跳过验证，返回true并且用户停留在表单上。

<form id="form" name="form" method="post" action="?action=my_php_form">
    <input type="submit" name="save" class="save" id="save" value="save"/>
    <input type="submit" name="next" id="next" class="next" value="next"/>
</form>

用户在重新加载后点击“保存”或“下一步”时，我已成功取得成功，但如果用户点击“下一步”，启动验证并提交返回false，则无法点击“保存”并忽略验证。可能是什么原因造成的？

$(function() {
    //Lets skip the whole thing if save is clicked
    $('#save').click(function() {
        $('#form').submit(function() {  
            return true;
        });
    });
    $('#next').click(function() {
        $('#form').submit(function() {
            var invalid = 0;
            //A lot of crazy validation, if some invalid stuff then increment increment invalid
            if(invalid > 0) {
                return false;
            }
            else {
                return true;
            }
        });
    });
});

Answer 1

我想我会做这样的事情：

$(function() {
    //Lets skip the whole thing if save is clicked
    //Actually, no binding is needed as the button is already a submit button
    //Thx to Ocanal

    $('#next').click(function() {
        var invalid = 0;
        //Validation process
        if(invalid) {
            $('#form').submit();
        } else {
            return false;
        }
    });
});

Answer 2

为什么要跳过验证，特别是如果它太疯狂了？无论如何问题就在这里

$('#form').submit(function() { ... }

这不会覆盖提交事件处理程序，这会向它添加一个函数。因此，如果您首先点击next然后点击save，则点击保存时仍会触发您为下一个定义的功能。

虽然用符号表达不清楚，但这是非常逻辑的：这就是允许你从你想要的任何地方“添加”你的documentReady事件的动作，而不仅仅是从中心位置。

Answer 3

您可以为非提交按钮使用其他类型。

你会想要这样的东西：

<form id="form" name="form" method="post" action="?action=my_php_form">
    <input type="submit" name="save" class="save" id="save" value="save"/>
    <input type="button" name="next" id="next" class="next" value="next"/>
</form>

我认为现在发生的事情是两个按钮都充当了“提交”按钮，因此表单正在尝试提交，无论您点击哪个按钮，或者您添加到EventListener的功能

Answer 4

首先，每次刷新页面时都会创建Java Script。理解这一点非常重要。

现在，如果您单击提交类型的按钮'Save'，您的信息将打包在表单数据包中并发送到服务器。提交操作需要重新加载页面（！）。因此，如果您想在字段中保留值（如果这是您想要的），您可以使用PHP。

使用PHP并不复杂。我将代码放在<body>标记内和<form>标记之前。代码检查'Save'变量的$_POST字段中是否有值，如果为真，我们将保存接收的值。

然后，我使用变量访问<? = $name ?>呈现值。就是这样。

<?php
    $name = "";
    $credit = "";
    if(isset($_POST['save'])) {
        $name = $_POST['name'];
        $credit = $_POST['creditCard'];
    }
?>
<form id="form" name="form" method="post" action="good.php">
    <input type="text" name="name" value="<?=$name ?>" />
    <input type="text" name="creditCard" value="<?=$credit ?>"/>
    <input type="submit" name="save" class="save" id="save" value="save"/>
    <input type="submit" name="next" id="next" class="next" value="next"/>
</form>

如何在一个表单中使用两个按钮执行不同的javascript操作？

4 个答案: