Php 同时使用onclick和onsubmit

我想同时执行onclick和onsubmit，这可能吗？或者，如果这是一种糟糕的做法，我如何合并这两个代码来执行这两个事件

我让这段代码检查表单标签上的必填字段：

onsubmit="return formCheck(this);"

然后，我在同一表单的提交按钮上有以下代码：

onClick="jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) }); return false;"

我的问题是，单击submit按钮时，它完全忽略了onsubmit代码。如何将它们合并在一起

更新我希望它先检查必填字段，然后发送表单，如果一切正常

---

更新：我已经粘贴了整个代码，我真的很挣扎，因为这是由以前的开发人员完成的。如果有人真的能把解决方案放到代码中，那就太好了。我将增加奖励。

将onClick代码放在与onSumbit代码相同的函数中

更新

在onClick代码的末尾返回false；，这将停止事件的正常传播，并停止onSubmit事件的触发。因此，如果您希望提交按钮提交表单，请删除returnfalse；从它的onClick处理器

单击“提交”按钮时，将在该按钮上触发一个单击事件，并在嵌套该按钮的窗体上触发一个提交事件，除非使用类似于return false；的命令停止事件的传播

因此，您实际上只需要一个提交事件处理程序来完成当前两个处理程序的工作

另外，由于页面中似乎包含jQuery核心，因此可以像下面这样附加事件处理程序：

$(function () {
    $('#form-id').on('submit', function () {
        var $this = $(this);//$this refers to the form that is being submitted
        jQuery.facebox({
            ajax : 'wishlist.php?emailme=true&name=' + $this.find('#name').val() + '&country=' + $this.find('#country').val() + '&email=' + $this.find('#email').val() + '&department=' + $this.find('#department').val()
        });

        //now we run your normal onSubmit code and return it's return value of this event handler
        return formCheck(this);
    });
});

onClick="if (formCheck(this)) { jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) });} return false;"

如果要将整个表单发送到jQuery.facebox函数，则可以使用jQuery的.serialize函数创建必要的查询字符串：

$(function () {
    $('#form-id').on('submit', function () {
        jQuery.facebox({
            ajax : 'wishlist.php?' + $(this).serialize()
        });

        return formCheck(this);
    });
});

下面是一个演示：

.serialize的文档：

注意.on在jQuery 1.7中是新的，在本例中与旧版本的.bind相同

更新

如果要在运行facebox插件之前检查formCheck函数的返回值，可以执行以下操作：

$(function () {
    $('#form-id').on('submit', function () {

        //check if the form data is valid
        if (formCheck(this) === true) {

            //if the form data is valid then run the facebox plugin
            jQuery.facebox({
                ajax : 'wishlist.php?' + $(this).serialize()
            });

            //also return true to stop running this function
            return true;
        }

        //if the form data is not valid then return false to stop the submission of the form
        return false;
    });
});

---

让onclick函数提交表单。

尝试将这两个函数结合起来，如下所示：

$(function () {
    $('#form-id').on('submit', function () {
        var $this = $(this);//$this refers to the form that is being submitted
        jQuery.facebox({
            ajax : 'wishlist.php?emailme=true&name=' + $this.find('#name').val() + '&country=' + $this.find('#country').val() + '&email=' + $this.find('#email').val() + '&department=' + $this.find('#department').val()
        });

        //now we run your normal onSubmit code and return it's return value of this event handler
        return formCheck(this);
    });
});

onClick="if (formCheck(this)) { jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) });} return false;"

---

不确定是否对同时使用onSubmit和onclick有特定要求，但这可能会有所帮助

以下是HTML：

<form id="my_form">
    Name: <input type="text" id="name" size="20" />
    <br />Country: <input type="text" id="country" size="20" />
    <br />Email: <input type="text" id="email" size="20" />
    <br />Department: <input type="text" id="dept" size="20" />
    <br /><input type="submit" id="submit" value="Login" />
</form>

现在，您可以做两件事：

1如果您使用AJAX处理表单内容，您可能希望保持返回值为false；在最后一行的第二行，因为这将阻止您提交表单

2如果您仍然想发布表单，只需删除return false；。您也可以使用$'my_form'发布表单。随时提交

这是小提琴：

---

希望这能有所帮助。

我建议您编写一个单独的函数，它执行与onClick事件相同的任务

---

首先检查onSubmit事件中是否输入了所有必填字段，如果没有返回false，则如果输入了所有必填字段，则调用与“onClick”事件中的函数执行相同任务的函数。

首先，您不需要同时执行这两个操作。在您的场景中，您只需要在表单标记上使用onSubmit属性

第二，如果属性上的操作包含对函数的引用，而不是内联代码，那么出于太多的原因，这会好得多

也就是说，我将修改代码如下：

//some js file included in the page's header
function formSubmitActions(element) {
     if (formCheck(element)) {
         jQuery.facebox({
                ajax : 'wishlist.php?emailme=true&name=' + element.name.value 
                       + '&country=' + element.country.value 
                       + '&email=' + element.email.value
                       + '&department=' + element.dept.value
         });
         return true;
     }
     return false;
}

//the form
<form [...] onsubmit="return formSubmitActions(this)">
[...]

---

希望有帮助

您现在可以在onclick事件jQuery.facebox{ajax:因此，在所有验证都通过后，只需将其移动到formCheck函数底部的on submit事件处理程序中即可

代码中有两个问题

1-可以通过在任何输入字段上按enter键提交表单。因此不会触发onclick事件

2-如果用户单击按钮，假设您添加了一些黑客，并且触发了onclick和onsubmit事件，但是formcheck返回false，则表单不会提交，但是单击事件将成功，您将向wishlist.php发送一个请求

我的建议如下：

onsubmit = "readyToSubmit(this); return false"

function readyToSubmit(a){
    if(formCheck(a)){
        jQuery.ajax({
                    url : ...,
                    success : function(data){a.submit()}
        })
    }
}

---

ajax async param to FALSE

为什么不把它们放在一起呢？提交将在提交和单击时进行，这样您就可以执行

onsubmit="return formCheck(this);jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) }); return false;"

---

您可以做一件事，只需编写提交表单的代码，如$'form_id'.submit；，而不是返回false；。这样，在完成.onclick代码功能后，它将提交表单。

onclick返回false，尝试删除它并查看onSubmit是否触发。为什么不将所有代码都放在提交处理程序中？您不知道为什么会这样你不需要两者都要。你想先运行哪个，onSubmit还是onClick？我同意rocket的观点，onClick返回false会停止事件冒泡，如果onClick先触发，那么onSubmit就会停止事件冒泡。请不要将JavaScript放在HTML元素中。这是草率的、不必要的，而且是一个需要处理的PITA。我已经尝试了各种方法进入Differnt功能，但在提交时只加载了一个白页。@Rob抱歉，我有一段时间很忙，但请查看我答案的更新，您可以使用几种不同的方法。@Rob如果您得到一个w

---

hite page然后表单很可能正在提交，表单的操作在某种程度上是无效的，要么是错误的URL，要么是页面有错误。感谢帮助，我已经在问题中添加了我的完整代码请参阅第二次更新，我想我需要更多的帮助。我会将赏金作为奖励。感觉这是正确的方向，但这样做只会导致一个白色页面，信息不会提交。虽然顺序正确，但我希望它先检查必填字段，然后如果通过发送表单。尝试将其放入提交中。谢谢帮助，我已经在问题中添加了我的完整代码，请参见第二次更新，我想我需要更多的人手。我将把赏金作为奖励。谢谢你的帮助，我已经在问题中添加了我的完整代码。请参阅第二次更新，我想我需要更多的帮助。我将增加赏金作为奖励。