Question

如果这是一个愚蠢的问题，请原谅我。

我试图使用ajax在表单提交上运行php脚本（不刷新页面。）

如果我允许表单的动作调用php文件，一切正常，但如果我使用return：false阻止该操作;没有任何反应。

表单非常简单，只是一个带有一些隐藏输入的按钮

<form action = 'index.php?page=addLike' method = 'POST'>
        <input type = 'hidden' name = 'post_id' value = '$post_id'/>
        <input type = 'hidden' name = 'user_id' value = '$user_id'/>
        <input type = 'submit' value = '' class = 'likeButton'/>
    </form>";

php看起来像这样

<?php

include_once "models/blogLikes_Table.class.php";
$like = new blogLikes_Table($db);

$user_id = $siteVisitor->getId();
$post_id = $_POST['post_id'];

$like->insertLike($user_id, $post_id);

blogLikes_Class中定义的insertLike函数看起来像这样，

public function insertLike($user_id, $post_id){
    $sql = "INSERT INTO blogLikes (user_id, post_id, value) VALUES ( ?,?,? )";
    $statement = $this->db->prepare($sql);
    $data = array($user_id, $post_id, "1");
    $statement->execute($data);
    return $statement;
}

我认为令我头痛的是脚本，看起来像这样，

$(".likeButton").click(function myCall() {

var request = $.ajax({
    url: "addLike.php",
    type: "GET" ,       
    data: "html"
});

request.done(function(msg) {
    alert("this works!!!!!");           
});

request.fail(function(jqXHR, textStatus) {
    alert( "Request failed: " + textStatus );
});
return false;
});

任何帮助都会非常感激！

Answer 1

从网址中删除操作并将其保留为action=""，因为您将使用Ajax提交表单。
您正在将Ajax类型设置为GET，如果您想POST，则需要将其更改为POST，如下所示。
您需要使用serializeArray()获取表单数据，该表单数据将一组表单元素编码为名称和值的数组。
将您的输入从type="submit"更改为type="button"。

尝试这样的事情：

    var postData = $("#your_form_id").serializeArray();
    var request = $.ajax({
        url : "addLike.php",
        type: "POST",
        data : postData
    });

这里是JSFiddle to demonstrate。

使用jQuery AJAX在表单提交上调用php页面

1 个答案: