javascript - Jvector 将国家名称更改为数据库名称?

标签 javascript php jquery ajax

我使用过Jvectormap,它运行良好。现在,如果我单击显示国家/地区名称的国家/地区,则其工作功能。

enter image description here 我创建了特定国家的简单数据库。通过 ajax 连接数据库,运行良好。它显示警报消息数据库创建的国家/地区。

enter image description here

创建了数据库加拿大国家。但现在我想在单击“加拿大”时显示数据库,而不是在警报框中显示数据库中的详细信息?请帮助我?

脚本:

<script>
    jQuery.noConflict();
    jQuery(function(){
      var $ = jQuery;
      $('#focus-single').click(function(){
        $('#map1').vectorMap('set', 'focus', {region: 'AU', animate: true});
      });
      $('#focus-multiple').click(function(){
        $('#map1').vectorMap('set', 'focus', {regions: ['AU', 'JP'], animate: true});
      });
      $('#focus-coords').click(function(){
        $('#map1').vectorMap('set', 'focus', {scale: 7, lat: 35, lng: 33, animate: true});
      });
      $('#focus-init').click(function(){
        $('#map1').vectorMap('set', 'focus', {scale: 1, x: 0.5, y: 0.5, animate: true});
      });
      $('#map1').vectorMap({
        map: 'world_mill_en',
        panOnDrag: true,
        focusOn: {
          x: 0.5,
          y: 0.5,
          scale: 1,
          animate: true
        },
        series: {
          regions: [{
            scale: ['#688FA0'],
            normalizeFunction: 'polynomial',
            values: {

             // "TD":23.4,
             // "TH": 312.61,
              "TL": 0.62,
              // "TZ":1.56,
              "TO": 0.3,
             // "TT": 21.2,
              //"TM":21.2,
             // "TR": 729.05,
              //"TJ":21.2,
             // "TN":4.3,
             //  "YE":0.3,
             // "UA": 136.56,
              // "QA":0.72,
              "GB": 2258.57,
              // "GA":4.6,
              "US": 14624.18,
               //"UG":4.3,
              //"UY": 40.71,
              // "UZ":0.72,
              "VU": 0.72,
              // "VE":5.77,
             // "VN": 101.99,
              // "ZW":8.4,
             //  "ZM":2.5,

            }
          }]
        },
        onRegionClick: function (event, code) {
        var map = $('#map1').vectorMap('get', 'mapObject');
        var name = map.getRegionName(code);
      /*
    onRegionLabelShow: function(e, el, code) {
    //search through data to find the selected country by it's code
    var country = $.grep(data.countries, function(obj, index) {
    return obj.code == code;
    })[0]; //snag the first one
    if (country != undefined) {
        el.html(el.html() + "<br/><b>Code: </b>" +country.code + "<br/><b>Continent : </b> " + country.continent);
    }
       */

        // get from DB using ajax

    $(document ).ready(function() {
$.ajax({
    type: "GET",
    url: 'database.php',

    data: {country: name},
    dataType: "text",
    success: function(data){
      //  alert(data);

    }
});
    });

},
      });
    })




  </script>

我的 PHP 代码:

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "mydatabase";

$_country = $_GET['country'];

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT countryId,country,pdogcoregion,ccl,category FROM countrydetails WHERE country='".$_country."'";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) {
        echo "country: " . $row["country"];
    }
} else {
    echo "No database";
}

$conn->close();
?>

此文件中的名称显示我更新此文件的简单部分代码

$.fn.vectorMap('addMap', 'world_mill_en',{"insets": [{"width": 900.0, "top": 0, "height": 440.7063107441331, "bbox": [{"y": -12651089.408837218, "x": -19971805.562327016}, {"y": 6919135.471157653, "x": 19994044.625421535}], "left": 0}], "paths": {"BD": {"path": "M652.71,228.85l-0.04,1.38l-0.46,-0.21l-0.42,0.3l0.05,0.65l-0.17,-1.37l-0.48,-1.26l-1.08,-1.6l-0.23,-0.13l-2.31,-0.11l-0.31,0.36l0.21,0.98l-0.6,1.11l-0.8,-0.4l-0.37,0.09l-0.23,0.3l-0.54,-0.21l-0.78,-0.19l-0.38,-2.04l-0.83,-1.89l0.4,-1.5l-0.16,-0.35l-1.24,-0.57l0.36,-0.62l1.5,-0.95l0.02,-0.49l-1.62,-1.26l0.64,-1.31l1.7,1.0l0.12,0.04l0.96,0.11l0.19,1.62l0.25,0.26l2.38,0.37l2.32,-0.04l1.06,0.33l-0.92,1.79l-0.97,0.13l-0.23,0.16l-0.77,1.51l0.05,0.35l1.37,1.37l0.5,-0.14l0.35,-1.46l0.24,-0.0l1.24,3.92Z", "name": "Bangladesh"}, "BE": {"path": "M429.28,143.95l1.76,0.25l0.13,-0.01l2.16,-0.64l1.46,1.34l1.26,0.71l-0.23,1.8l-0.44,0.08l-0.24,0.25l-0.2,1.36l-1.8,-1.22l-0.23,-0.05l-1.14,0.23l-1.62,-1.43l-1.15,-1.31l-0.21,-0.1l-0.95,-0.04l-0.21,-0.68l1.66,-0.54Z", "name": "Belgium"}

请任何人帮助我。我是 jQuery 和 JavaScript 新手。

最佳答案

if ($结果->num_rows > 0) { //输出每一行的数据 while($row = $result->fetch_assoc()) { 回显“国家:”。 $row["国家/地区"]; } }
你还是回国吧。 尝试
if ($结果->num_rows > 0) { //输出每一行的数据 while($row = $result->fetch_assoc()) { 回显“类别:”。 $行[“类别”]; } }

关于javascript - Jvector 将国家名称更改为数据库名称?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30433297/

相关文章:

javascript - 如何在 Electron 中禁用下一个/上一个键(来自鼠标)?

javascript - 我有下面的代码 - 在 IE 和 Opera 中工作得很好,但在 Firefox/Netscape 中根本不起作用。有任何想法吗?

javascript - 如何使用url和jquery

javascript - 从 JSON 文件中获取一组特定的键/值对

php - Excel CSV 和 MySQL 之间的编码问题

php - 从关系记录表中选择多个条目的动态查询

php - 嵌入式数据集的 mySQL INSERT 和 SELECT 查询

javascript - 带有自定义参数的Ajax请求

javascript - 防止同一函数触发两次

JavaScript 对象文字 "this"关键字 jQuery 回调参数传递