具有地圖區域的AJAX動態頁面內容

Question

我正在使用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的新手，因此，我將不勝感激。 我可能錯過了一個非常關鍵的部分。

Answer 1

當您說“地圖未響應”時，您的意思是您的highlightRegionOfCountry和unhighlightRegionOfCountry都在工作，僅僅是ajax調用不起作用？ 而您想要的是$ php腳本中$ post變量的值最終出現在您的元素中？

如果是這樣，我認為您在jQuery ajax調用中如何接收數據有些困惑。 您不會通過將php代碼放在javascript代碼中來接收它，而是會在傳遞給成功回調函數的數據中的“響應”變量中接收它。 另外，您還必須將單擊的代碼作為數據傳遞給ajax調用。 另外，您不能僅在dom元素上使用普通的“ html”屬性，因此我將對其進行更改。 因此，您的ajax調用應更改為：

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

另外，在php中引用字符串也是一種更好的做法，所以不要使用case China :，使用case'China'：等等。