如何將數據從PHP數組傳遞到Javascript

Question

我正在嘗試使用bootstrap-year-calendar，但無法以正確的方式傳遞值。

我有這樣一種數據數組：

<?php

$data = array(
    array(
        "startDate" => "2016-1-4",
        "endDate" => "2016-1-4"
    ),
    array(
        "startDate" => "2016-1-8",
        "endDate" => "2016-1-8"
    ),
    array(
        "startDate" => "2016-1-16",
        "endDate" => "2016-1-16"
    )
);

?>

但我必須做這樣的事情：

<?php // I have here my $data array ?>

<div id="calendar"></div>

<script>

$(function() {  
    $('#calendar').calendar({
        dataSource: [
            {
                startDate: new Date(2016, 1, 4),
                endDate: new Date(2016, 1, 4)
            },
            {
                startDate: new Date(2016, 1, 8),
                endDate: new Date(2016, 1, 8)
            }
            ,
            {
                startDate: new Date(2016, 1, 16),
                endDate: new Date(2016, 1, 16)
            }
        ]
    });
});

</script>

如何將$ data數組傳遞給'datasource'變量？

Answer 1

使用json：

做類似的事情

<?php

$data = array(
    array(
        "startDate" => "2016-1-4",
        "endDate" => "2016-1-4"
    ),
    array(
        "startDate" => "2016-1-8",
        "endDate" => "2016-1-8"
    ),
    array(
        "startDate" => "2016-1-16",
        "endDate" => "2016-1-16"
    )
);
echo '<script>var data = '.json_encode($data).'</script>';
?>

<script>
$.each(data, function(i, v) {
  $.each(v, function(x, t) {
   data[i][x] = new Date(t);
  });
});
$(function() {  
    $('#calendar').calendar({
        dataSource: JSON.parse(data)
    });
});

</script>

附：您可能需要稍微調整一下日期

演示： http : //jsfiddle.net/jnp2ssts/1/

Answer 2

您可以執行類似頁面加載時（如果是PHP頁面）或使用AJAX接收數據的操作

var data = <?php echo json_encode($data); ?>;

然后只需將此變量與數據源一起使用

dataSource : data

最終代碼看起來像

var data = <?php echo json_encode($data); ?>;
$(function() {  
    $('#calendar').calendar({
        dataSource: data
    });
});

Answer 3

是的，您可以使用json_encode()

<---Your array in php--->
<script type="text/javascript">

    var jArray= <?php echo json_encode($phpArray ); ?>;

    for(var<your loop>){
        alert(jArray[i]);
    }

 </script>