-1

我有一个从 PHP while 循环自动生成的表单。

我希望表单使用 AJAX 提交数据并做到这一点，我有以下...

PHP 表单

<div class="user">
    <span>Become friends with '.$row['screen_name'].'</span>
    <form method="POST" action="./create.php">
        <input type="hidden" value="'.$row['user_id'].'" name="follow_id" class="follow_id" />
        <input type="submit" class="follow-submit" value="Get '.$row['credits_offered'].' Credits" />
    </form>
</div>

AJAX

// Create Friendship AJAX
$(".follow-submit").on("click", function() {

    var follow_id = $(".folow_id").val();

    var dataString = 'follow_id=' + follow_id;
    alert (datastring); return false;

    $.ajax({
      type: "POST",
      url: "update.php",
      data: dataString,
      success: function() {
        $('.message').html("<p>Friend request sent!</p>");
      }
     });
    return false;

});

问题是我的 AJAX，点击事件似乎甚至没有注册，表单继续发布并重定向到 create.php

4

4 回答 4

2 
$(".follow-submit").on("click", function(event) {event.preventDefault();
...
于 2013-06-02T08:10:18.273 回答
0

将此代码添加为调试，看看有什么问题

success: function($res) {
    console.log($res)
    $('.message').html("<p>Friend request sent!</p>");
  },
error: function($a, $b) {
    console.log($a); 
    console.log($b);
}

如果存在，在 firefox 的 firebug 控制台中将打印错误

于 2013-06-02T08:12:33.820 回答
0

您正在通过第一 return条语句停止执行 AJAX 函数。删除它，您的代码也应该可以工作；为防止锚重定向到 create.php，您必须event.preventDefault();在单击处理程序函数中添加。您的代码应如下所示： 

// Create Friendship AJAX
$(".follow-submit").on("click", function(event) {
event.preventDefault();
    var follow_id = $(".folow_id").val();

    var dataString = 'follow_id=' + follow_id;
    //alert (datastring); return false;

    $.ajax({
      type: "POST",
      url: "update.php",
      data: dataString,
      success: function() {
        $('.message').html("<p>Friend request sent!</p>");
      }
     });
    return false;

});
于 2013-06-02T08:13:35.477 回答
0

问题是您没有取消提交事件。为此，您必须将该事件作为 click 函数的参数并preventDefault()对其进行调用。此外，return false您甚至在启动 AJAX 之前就在其中停止了您的功能。你也有一个错字，你键入folow_id而不是follow_id在你的 JavaScript 的第二行。此外，我认为更合适的方法是使用该submit()功能。在您的表格上放一个 ID，然后这样做：

HTML：

<div class="user">
    <span>Become friends with '.$row['screen_name'].'</span>
    <form id="follow-form" method="POST" action="./create.php">
        <input type="hidden" value="'.$row['user_id'].'" name="follow_id" class="follow_id" />
        <input type="submit" class="follow-submit" value="Get '.$row['credits_offered'].' Credits" />
    </form>
</div>

JavaScript：

// Create Friendship AJAX
$("#follow-form").submit(function(event) {
    event.preventDefault();
    var follow_id = $(".follow_id").val();

    var dataString = 'follow_id=' + follow_id;
    // alert (datastring); return false;

    $.ajax({
      type: "POST",
      url: "update.php",
      data: dataString,
      success: function() {
        $('.message').html("<p>Friend request sent!</p>");
      }
    });

    return false;
});
于 2013-06-02T08:28:30.230 回答