Question

以下是我通过jquery ajax传递PHP数组数据的方法，并且在调用php脚本的过程之后，它首次成功加载，但是进一步的请求没有显示任何更新的数据。

我有两个问题

1：如果我直接加载页面（mydomain.com/new.php）来检查图表功能（这里我手动设置$ myPrray的$ _POST值），加载是快速而快速，但是当通过ajax调用它需要花费很多时间。 这个问题是要知道事情是如何运作的

2：第一次加载成功虽然占用了自己的时间，但是当我再次单击按钮调用图表时，剩余的文本会成功加载而不是图表？

mypage.php

<?php
        $aCoders = array();  
        $aCoders['Ed']['age'] = 25;  
        $aCoders['Ed']['languages'] = array('PHP', 'MySQL', 'JavaScript', 'Objective-C', 'HTML', 'CSS');  
        $aCoders['Sarah']['age'] = 25;  
        $aCoders['Sarah']['languages'] = array('HTML', 'CSS');  
    ?>

/* HTML PART */
<button type="button" class="btn btn-warning btn-sm pull-right" id="new" >

             Call The Graph </button> 
              <hr />

              <div id="whereToPrint"></div> // Here the graph Loads
      <br />
      <hr />



<script>
$(document).ready(function (){
/* Check Starts*/
        var activities = <?php echo json_encode($aCoders); ?>;
        $('#new').click(function (e){
           $("#flash").show();
            $("#flash").fadeIn(400);
             $.ajax({
                    type: "POST",
                    url: "new.php",
                    data: { activitiesArray : activities },
                    cache: false,
                    async: false,
                    error: function (jqXHR, textStatus, errorThrown) {
                        alert('error');
                    },
                    success: function (data) {
                        //alert("new3");

                        $('#whereToPrint').fadeIn(2000).html(data);
                        $("#flash").hide();
                        }

                });

             });


        });
</script>

new.php

<?php 
$myArray = $_POST['activitiesArray'];

//其他脚本和数据库调用

?>
<script src="js/jquery.js" ></script>
<script type="text/javascript">
$(function () {
        $('#container').highcharts({
            // Here the script for the bar chart stacked goes using the $myArray values
            // Its working all fine
            });
    });


        </script> 
<h2>Here is your chart</h2>        
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<script src="highstock-js/highstock.js"></script> 
<script src="highstock-js/exporting.js"></script> 
<script src="highstock-js/highcharts-more.js"></script>

输出

enter image description here

Answer 1

一旦我删除所有不存在的代码片段（如javascript文件highstock-js / highstock.js）和对$('#container').highcharts({})的调用（未在您提供的代码中定义），脚本就会运行每次为我重新加载 - 每次我点击按钮。

但是，您提供的代码不足以找出问题所在。

但是为了调试代码并找到错误 - 我强烈建议使用安装了Firebug扩展程序的Firefox或打开开发人员工具的Chrome（菜单 - ＆gt;工具 - >开发人员工具） - 查看“网络”标签 - 您会看到加载的文件 - 他们花费的时间 - 并检查控制台的Javascript错误。去那里应该很容易。

为什么我的高图表不会在后续的jquery-ajax调用中加载？

1 个答案: