jquery ajax表单提交答案

【问题标题】：jquery ajax form submitjquery ajax表单提交
【发布时间】：2012-04-05 01:18:46
【问题描述】：

这段代码正确吗？我正在尝试提交它，如果文本区域再次为空，我也想提交。

<script type="text/javascript">
$(document).ready(function(){

    $("form#submit").submit(function() {
        // we want to store the values from the form input box, then send via ajax below
        var fid = $(".messag").attr("id");
        var val = $("#mess_ar").val();
        $.ajax({
            type: "POST",
            url: "send_message.php",
            data: "fid="+ fid +"&val="+ val,
            success: function(){
                    $("#mess_ar").
            }
        });
        return false;
    });
}):
</script>

我正在尝试上传这个：

<form id="submit" method="POST">
<textarea name="mess_cont" id="mess_ar" autofocus="autofocus" cols="70" rows="5">      </textarea>
<button id="mess_but" type="submit">Send</button>
</form>

谢谢...

【问题讨论】：

你可能需要像$("form#submit").submit(function(e) {这样在你的事件捕获函数中添加一个参数，然后你可以使用e.preventDefault()来停止默认操作，提交，发生
@ianbarker 返回 false；已经在最后使用了。
您发布的 HTML 中没有任何内容具有“messag”类，因此尝试设置“fid”的行会将其设置为null。 “成功”功能显然不完整；你想只调用.val('') 来清除文本区域吗？
@TJ。我错过了，但是我认为preventDefault() 是使用 jQuery 时的首选方法
.messag 是此表单中的元素

标签： javascript jquery ajax post submit

【解决方案1】：

看起来不错。要清空文本区域，请在 ajax 成功回调中使用以下内容：

$("#mess_ar").val('');

【讨论】：

【解决方案2】：

$(function(){
    $("form#submit").submit(function(e){
        e.preventDefault();
        var fid = $(".messag").attr("id");
        var val = $("#mess_ar").val();
        $.ajax({
            type: "POST",
            url: "send_message.php",
            data: "fid="+ fid +"&val="+ val,
            success: function(){
                $("#mess_ar").val("");
            }
        });
    });
});

使用

$("#submit").on('submit', function(e){...});

而不是

$("#submit").submit(function(e){...});

如果您使用的是最新版本的 jquery。

【讨论】：

为什么提交时会重新加载整个页面？
你添加了e.preventDefault()吗，请看这个jsfiddle.net/GkCbD/2

【解决方案3】：

您真正在寻找什么？它是否也返回数据作为响应？添加功能以跟踪您的错误案例。制作类似的东西

<script type="text/javascript">
$(document).ready(function(){

    $("form#submit").submit(function() {
       // we want to store the values from the form input box, then send via ajax below
       var fid = $(".messag").attr("id");
       var val = $("#mess_ar").val();
       $.ajax({
          type: "POST",
          url: "send_message.php",
          data: "fid="+ fid +"&val="+ val,
          success: function(incoming_data){
             // ALERT incoming data if coming
             $("#mess_ar").text(""); // DO YOUR JOB CONTINUOU
          },
          error: function() { 
             alert("BROKEN REQUEST.");
          }
       });
       return false;
   });

});
</script>

否则，看起来一切都很好。

【讨论】：

我应该能够在我的 php 文件行正常 $_POST[''] 中接收它们？
是的，当您从 ajax 传递参数时 ` 数据： "fid="+ fid +"&val="+ val` 所以它们可以通过$_POST['fid'] 和 '$_POST 在 php 中访问['val']'。但是，错误以客户端错误对象的形式出现。所以，如果你想传递到 php 服务器端，你需要制作另一个可以传递错误对象的罐子！