如何在不使用AJAX刷新的情况下发送表单的数据 - How to send data of a form without refreshing using AJAX?

How to send data of a form without refreshing using AJAX?

我有一个表单，它只包含两个按钮，一个喜欢按钮和一个不喜欢按钮。每个按钮都会在按钮的"action"部分获得产品的ID，我想将其传递给一个包含pdo函数的php文件，以便向我的数据库提交喜欢/不喜欢的内容，但我不希望刷新页面。

我真的是AJAX的新手，不知道如何使用它来解决这个问题。下面是相关的代码，我想知道我是否可以得到一些关于如何使用AJAX的技巧？

index.html

<form id="likeDislike" class="form-horizontal" action="index.php?id=' . $productData->getID() .'" method="post">
    <button id="like" type="submit" name="like" value="like" class="btn btn-success"><i class="glyphicon glyphicon-thumbs-up"></i></button>                            
    <button id="dislike" type="submit" name="dislike" value="dislike" class="btn btn-danger"><i class="glyphicon glyphicon-thumbs-down"></i></button>
</form>

index.php

if (isset($_POST["like"])) {
    $productDataSet = new productDataSet();    
    $productDataSet->addLike();
}    
if (isset($_POST["dislike"])) {
    $productDataSet = new productDataSet();    
    $productDataSet->addDislike();
}

为什么不在jquery中执行此操作？你可以这样做。。

$（'#like'）.click（function（）｛

                        var input = $("<input>").attr(
                                "type", "hidden").attr(
                                "name", "update_like").val(
                                JSON.stringify("1"));
                        $('#likeDislike').append($(input));
                    })

$（'#厌恶'）.点击（function（）｛

                        var input = $("<input>").attr(
                                "type", "hidden").attr(
                                "name", "update_dislike").val(
                                JSON.stringify("1"));
                        $('#likeDislike').append($(input));
                    })

因此，在服务器端，u将收到带有update_like或update_dislike输入的表单，您只需添加即可。

您可以使用jQuery来完成此操作。只需将jQuery添加到您的javascript项目中，并使用此代码将数据发布到php文件中，然后从中获得响应。

我们认为您有一个id为btnLike和btnDisLike的元素。他们有一个名为postID的自定义属性。

这是jQuery代码：

$(document).ready(function(){
     $("#btnLike").click(function(){
         $.post("./submit.php",{Request : "Like"  ,  PostID : $(this).attr("postID")},function(data,status){
             // data is the response
         });
     });

     $("#btnDisLike").click(function(){
         $.post("./submit.php",{Request : "DisLike"  ,  PostID : $(this).attr("postID")},function(data,status){
             // data is the response
         });
     });
});

您可以在$_POST全局变量中使用Request和PostID来访问传递的数据。