Question

我想从sql-table加载一些数据，并使用jquery为地图着色。

我用PHP获取数据：

<?php
  include 'connect.php';
  session_start();
  $userid = $_SESSION['userid'];

  $sql = "
  SELECT landstatus.shortland
  FROM landstatus         
  WHERE users_id='1' 
  AND status ='wanttovisit'
  ";

  $result = $conn->query($sql);

  if ($result->num_rows > 0) {
      // output data of each row
      while($row = $result->fetch_assoc()) {
          echo $row["shortland"]. "<br>";
      }
  } 
  $conn->close();
?>

现在我想在jquery中使用shortland作为静态值'ca'：

<script>
  jQuery(document).ready(function () {
      jQuery('#vmap').vectorMap({
      map: 'world_en',
      backgroundColor: '#333333',
      color: '#FFFFFF',
      hoverOpacity: 0.7,
      selectedColor: '#727272',
      enableZoom: true,
      colors:{
              'ca' : '#4E7387',
          },
          series: {
            regions: 
            [{
              attribute: 'fill'
            }]
          },

      onRegionClick: function (element, code, region) {
        $(".info-box-region").append(region);
        $(".info-box").show();
        $("input[name=region]").val(region);
        $('input[name=code]').val(code);
      }

    });
  });
</script>

最后，颜色将填充数据库中的所有短地 - 每个短地都有相同的十六进制代码。

帮助我帮助我。

Answer 1

将所有短地值放在一个数组中并循环显示它以创建ca条目

  $result = $conn->query($sql);

  $shortlands = array();
  if ($result->num_rows > 0) {
     // output data of each row
     while($row = $result->fetch_assoc()) {
        $shortlands[] = $row["shortland"];
     }
  }

然后遍历值。 e.g。

colors:{
<?php
foreach ($shortlands as $val) {
   echo "'{$val}': '#4E7387',\n";
}
?>
},

Answer 2

您可以将PHP知道的任何内容“传递”到JavaScript变量中，只需将它们回显到模板中的JavaScript代码中即可：

<script>
    var myJavaScriptVar = <?php echo $myPhpVar ?>
</script>

Answer 3

这样做：

<script>
  jQuery(document).ready(function () {
      jQuery('#vmap').vectorMap({
      map: 'world_en',
      backgroundColor: '#333333',
      color: '#FFFFFF',
      hoverOpacity: 0.7,
      selectedColor: '#727272',
      enableZoom: true,
      colors:{
              'ca' : '<?php echo $row["shortland"] ;?>',
          },
          series: {
            regions: 
            [{
              attribute: 'fill'
            }]
          },

      onRegionClick: function (element, code, region) {
        $(".info-box-region").append(region);
        $(".info-box").show();
        $("input[name=region]").val(region);
        $('input[name=code]').val(code);
      }

    });
  });
</script>

将PHP变量传递给Jquery

3 个答案: