javascript - 单击按钮时 jQuery 返回 PHP 脚本

Question

目前，我有一个包含 PHP 脚本的 HTML 页面。用户登录后，配合php脚本，自动返回页面数据，如下:

 <section class="content">
 <?php include("api/qnams_all.php"); ?>
 </section>

该脚本包含一个查询，该查询返回 ID 为 #example1 的表。

使用该 ID，我将使用 jQuery DataTables 来格式化来自该脚本的数据:

 $('#example1').DataTable({
 {
   "dataType": "json",  
   "iDisplayLength": 25,
   "bDestroy": true,
   "stateSave": true
 });

现在，我想做的是检查是否通过 jQuery 单击了按钮，如果是，则运行不同的 php 脚本。

所以在上面的那个部分标签中，我想做这样的事情:

 <section class="content">
 <button type="button" id="buttonSearch">Search</button>
 <script type="text/javascript">
   if('#buttonSearch').click(function()  
   {
     // return <?php include("api/differentScript.php"); ?>
   }
   else
   {
     // return <?php include("api/qnams_all.php"); ?>
   });
 </script>
 </section>

我确信 JavaScript 中的语法可能有误。我试图展示我正在尝试做的事情的例子。

这可以做到吗？

Answer 1

我会使用 ajax 调用页面。听取 PHP 中请求的内容并返回。然后将此结果添加到页面上的 HTML 对象。

我会采用与此类似的方法；

<?php 

if(isset($_POST['script1'])){
    include("api/differentScript.php");
    exit;
}

if(isset($_POST['script2'])){
    include("api/qnams_all.php");
    exit;
}

?>

<div id='output'></div>


<script type="text/javascript">

    $("#buttonSearch").on('click', function(){
        $.ajax({
            type:"POST",
            url: "/page_location/",
            data: "script1=true",
            success: function(result){
                $("#output").html(result);
            }
        });
    });

    $("#buttonSearch2").on('click', function(){
        $.ajax({
            type:"POST",
            url: "/page_location/",
            data: "script2=true",
            success: function(result){
                $("#output").html(result);
            }
        });
    });

</script>

我不确定数据表是如何工作的，如果您要将数据存储在一个变量中，您可以通过将其更改为:

data: {script1: true, post_data_1: var},