提交表单与AJAX PHP的JQuery带我到操作页面 [英] Submit Form with AJAX PHP JQuery takes me to action page

问题描述

我想无需刷新页面提交这种形式，但是当我提出需要我来操作页面。什么是错我的code？ 这是我的方式：

 ＆LT;窗​​体类=Ajax的行动=/../ addchannel / createUser.php的方法=邮报＆GT;
＆LT;输入类型=文本NAME =username的占位符=username的＆GT;＆LT; BR＆GT;
＆LT;输入类型=文本名称=电子邮件占位符=电子邮件＆GT;＆LT; BR＆GT;
＆LT;输入类型=提交值=提交＆GT;
＆LT; /形式GT;';
 

这是我的脚本：

  $（'form.ajax'）。在（'提交'，函数（）{
    VAR的= $（本），
        URL = that.attr（'行动），
        TYPE = that.attr（方法），
        数据= {};

    that.find（['名称']）。每个（函数（指数值））{
        VAR的= $（本），
            NAME = that.attr（名称），
            值= that.val（）;
        数据[名] =值;
    }）;
$阿贾克斯（{
    网址：网址，
    类型：类型，
    数据：数据，
    成功：函数（响应）{
        consol.log的（响应）
    }
}）;
}）;
 

解决方案

通事件作为参数，并使用事件。preventDefault（）。

示例

  $（'form.ajax'）。在（'提交'，函数（E）{
      即preventDefault（）;
 

I am trying to submit this form without refreshing the page , but when i submit it takes me to action page. what is wrong with my code? This is my form:

<form class="ajax" action="/../addchannel/createUser.php" method="post" >
<input type="text" name="userName" placeholder="userName"><br>
<input type="text" name="email" placeholder="email"><br>
<input  type="submit" value="submit" >
</form>';

And this is my script:

$('form.ajax').on('submit', function () {
    var that = $(this),
        url = that.attr('action'),
        type = that.attr('method'),
        data = {};

    that.find(['name']).each(function (index, value)) {
        var that = $(this),
            name = that.attr('name'),
            value = that.val();
        data[name] = value;
    });
$.ajax({
    url: url,
    type: type,
    data: data,
    success: function (response) {
        consol.log(response)
    }
});
});

解决方案

Pass event as argument and use event.preventDefault().

Example

$('form.ajax').on('submit', function (e) {
      e.preventDefault();

这篇关于提交表单与AJAX PHP的JQuery带我到操作页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！