通過jquery從php數組中獲取單個字符串，並將其加載到html div中

Question

我正在嘗試從php數組$ F []中獲取字符串“ Name n”，該數組在函數DataInit1（）中隨機分配，並將其放在我的html文件中的div中。 但是，PHP文件無法更改，因為數組是隨機的並用於繪制一系列圖形。

PHP文件：

<?php
$Return = array();
$P = array();
$S = array();
$F = array();

$P[] = [0];
$S[] = [[0.00,111],[0.50,104.74],[1.00,91.29],[1.50,93.28],...];
$F[] = "Name 1";

$P[] = [0];
$S[] = [[0.00,199],[0.50,84.06],[1.00,82.43],[1.50,83.02],...];
$F[] = "Name 2";

for($i=0; $i<count($P); $i++)
{
$Return[] = $P[$i];
$Return[] = $S[$i];
$Return[] = $F[$i];
}
die(json_encode($Return));

?>

HTML檔案：

<div id="GRAPH">
    <div id="title"><h1 id='graphtitle'></h1></div>
       <h1 id='GraphNum'></h1>
    <div id="chart"></div>
        <h1 id='PointNum'></h1>
</div>

字符串應放在JS文件中的“ ARRAY $ F”中，如下所示：

function DataInit1()
{
$.ajaxSetup({cache: false, async: false});
$.getJSON("data1.php",
    function(Data1)
    {   
        SeriesList = [];
        CurrentGraph.Series = 0;
        for(var i=0; i<Data1.length; i+=3)
        {
            var P = Data1[i+0];
            var S = Data1[i+1];
            var F = Data1[i+2];
            var NewSeries = new SeriesClass(P,S,F);
            NewSeries.SeriesNumber = (i/3)+1;
            SeriesList.push(NewSeries);
        }
    }
);

for(var i=SeriesList.length-1; i>0; i--) 
{
    var j = Math.floor(Math.random() * (i+1));
    var x = SeriesList[i];
    SeriesList[i] = SeriesList[j];
    SeriesList[j] = x;
}
}

........

function Title()
{
    $("#title").show();
    $.ajaxSetup({cache: false, async: false});
    $.getJSON("data1.php",
        function(data)              
        {
            var name = ARRAY $F; 
        });
    $("#graphtitle").html(name);
}

在這個問題上任何其他想法或建議都將受到歡迎。 謝謝。

更新：

根據ironpilot的建議。 解決方案可以是這樣嗎？：

function Title()
{
$("#title").show();
$.ajaxSetup({cache: false, async: false});
$.getJSON("CurrentGraph.Series",        
    function(data)                 
    {   
    var titleGraph = (json_decode($F, true));
    var name = data.titleGraph[0];  
    $("#graphtitle").html(name);
    });
}

Answer 1

您的代碼中有一些問題需要糾正，然后才能解決。 首先讓我們看一下您的PHP代碼。 看來您想創建一些並行數組，然后將它們返回到前端代碼。 但是，將每個數組添加到$Return數組的方式使得預測元素的位置幾乎是不可能的。

讓我們首先將$Return變量轉換為stdClass對象。 這將允許您在對象上指定任意屬性，並使它們可通過JavaScript對象訪問。

<?php
$Return = new stdClass();
$Return->P = array();
$Return->S = array();
$Return->F = array();
$P = array();
$S = array();
$F = array();

$P[] = [0];
$S[] = [[0.00,111],[0.50,104.74],[1.00,91.29],[1.50,93.28],...];
$F[] = "Name 1";

$P[] = [0];
$S[] = [[0.00,199],[0.50,84.06],[1.00,82.43],[1.50,83.02],...];
$F[] = "Name 2";

for($i=0; $i<count($P); $i++)
{
    $Return->P = $P[$i];
    $Return->S = $S[$i];
    $Return->F = $F[$i];
}
die(json_encode($Return));

?>

現在我們有了更多可預測的對象，我們可以更正jQuery代碼：

function Title()
{
    $("#title").show();
    $.ajaxSetup({cache: false, async: false});
    $.getJSON("data1.php",
        function(data)              
        {
            var name = data.F[0]; //Select the first element of the $F array.
            $("#graphtitle").html(name);
        });
}

現在我們有了從PHP返回的對象，您可以使用var name = data.F[0];專門訪問名稱數組以獲取所需的值var name = data.F[0]; 。 另外，由於此變量是使用成功函數內的var關鍵字聲明的，因此在設置該函數的函數外部無法訪問其值。

我們還需要將您的#graphtitle選擇器移動到jQuery success方法中。 由於此方法實際上是一個承諾，並且在AJAX請求完成之前不會執行，因此發生的情況是，在您收到服務器發出的帶有響應的響應之前，用於設置所選擇元素的html內容的函數將已經執行。要放置的內容。 這稱為競賽條件： https : //en.wikipedia.org/wiki/Race_condition 。

希望對您有所幫助！