0

我正在使用 JQVMaps 在 WordPress 网站上创建世界地图。我需要根据用户点击的区域生成页面内容。这是我迄今为止的概念证明：

    <div id="post"></div>
    <script>
        jQuery('#vmap').vectorMap({
            map: 'world_en',
            backgroundColor: '#fff',
            borderColor: '#bbb',
            borderOpacity: 1,
            borderWidth: .2,
            color: '#bbb',
            onRegionOver : function (element, code, region)
            {
                highlightRegionOfCountry(code);
            },
            onRegionOut : function (element, code, region)
            {
                unhighlightRegionOfCountry(code);
            },
            onRegionClick: function(element, code, region)
            {
                highlightRegionOfCountry(code);
                $.ajax('/get_chart_data.php', {
                    dataType: 'json',
                    success: function(response) {
                        var jspost = "<?php echo $post; ?>";
                        var el = document.getElementById("post");
                        el.html = jspost;
                    }
                });
            }   
        });
   </script>

这就是我在 get_chart_data.php 中的内容：

<?php

    // Switch based on region
    switch($_REQUEST['region']) {
      case China:
        $post = 'You clicked China';
        break;
      case Canada:
        $post = 'You clicked Canada';
        break;
      case Brazil:
        $post = 'You clicked Brazil';
        break;
    }

    echo json_encode($post);
?>

我没有从地图上得到任何回应。我对 AJAX 非常陌生，因此我将不胜感激能得到的任何帮助。我可能错过了一个非常关键的部分。

4

1 回答 1

1

当您说“地图没有响应”时，您的意思是您的 highlightRegionOfCountry 和 unhighlightRegionOfCountry 正在工作，而只是您的 ajax 调用不起作用？而你想要的是你的 php 脚本中 $post 变量的值最终出现在你的元素中？

如果是这种情况，我认为您如何在 jQuery ajax 调用中接收数据有点混乱。您不会通过将 php 代码放入 javascript 代码中来接收它，您将在传递给您的成功回调函数的数据中接收它，在您拥有的变量“response”中。此外，您必须将单击的代码作为 ajax 调用中的数据传递。另外，你不能在 dom 元素上只使用一个普通的“html”属性，所以我会改变它。因此，您的 ajax 调用应更改为：

$.ajax({
    url: "/get_chart_data.php",
    data: {
        region: region
    },
    success: function(response) {
        $("#post").html(response);
    }
});

此外，在 php 中引用您的字符串也是一种更好的做法，因此不要使用 case China:，使用 case 'China': 等等。

于 2014-09-02T03:35:20.103 回答