php - 将 HTML 代码作为变量传递/使用 PHP 写入特定元素

Question

我正在尝试制作一个从数据库加载值然后以仪表形式显示这些值的站点。我正在为仪表使用 jquery 插件，这些插件的格式是

<p id='NameofGauge' class='plot' style='height:100px;width:175px;float:left;'   title='GaugeValue'></p>

有一个显示 4 个仪表的顶层，当您单击其中一个顶层仪表时，它会显示属于该顶层仪表所代表类别的其他仪表。我已经从数据库中提取了这些值，可以将它们写入一个量规，并且尽管完全是硬编码，但它仍然可以工作。我现在正试图使该网站更具活力，即。数据库中的条目越多，仪表就越多。我可以为顶级仪表或较低级别的仪表执行此操作，但我找不到一种方法来在单击顶级仪表时显示较低级别的仪表。

这是我目前的代码；

$mymodel2 = new model();
    print "<div id='gaugearray5'>";
    $Testkpiquery1 = mysql_query("select * FROM KPI where KpiSection like 'Finance'");

    $TotalValue;
    $number = mysql_num_rows($Testkpiquery1);
    $Group = $KPIArray['KpiGroup'];
    while ($KPIArray = mysql_fetch_array($Testkpiquery1, MYSQL_ASSOC)) {
    $Group = $KPIArray['KpiGroup'];
    $kpiname = $KPIArray['KpiName'];
    $kpidescription = $KPIArray['KpiDescription'];
    $Units = $KPIArray['Units'];
    $Column1 = $KPIArray['Val1'];
    $Column2 = $KPIArray['Val2'];
    $Target = $KPIArray['Target'];
    $Gauge = $KPIArray['GaugeType'];





    $TestdataqueryThis = mysql_query("select * FROM data_nir where period like '201101'");
    $TestdataqueryCompare = mysql_query("select * FROM data_nir where period like '201001'");
    $DataArray = mysql_fetch_array($TestdataqueryThis);
    $DataArrayCompare = mysql_fetch_array($TestdataqueryCompare);



    $ValueNow = ($DataArray[$Column1]) / ($DataArray[$Column2] * 1.609344);
    $ValueCompare = ($DataArrayCompare[$Column1]) / ($DataArrayCompare[$Column2] * 1.609344);

    $ValuetoPrint = ($ValueNow * 100) / $ValueCompare;

    $TotalValue = $ValuetoPrint + $TotalValue;
    $TargetPerc = ($ValueNow * 100) / $Target;

    $StringtoPrint .= "<p id='".$kpiname."' class='plot' style='height:100px;width:175px;float:left;' title=".$ValuetoPrint." onmouseover=GenericLabel('".$kpidescription."',".$ValueNow.",".$ValueCompare.",".$Target.",".$ValuetoPrint.",".$TargetPerc.")></p>";
    }

    $TotalValuetoPrint = $TotalValue / $number;
    print "<p id='".$Group."' class='plot' style='height:100px;width:175px;float:left;' title='".$TotalValuetoPrint."' onClick=LowerLevelPrint('".$StringtoPrint."')></p>";

    print("</div>");

因为'$StringtoPrint'中有多个引号我无法将其传递给 javascript 函数 LowerLevelPrint() . LowerLevelPrint()包含 document.GetElementById('breakdownlayer').innerHTML将字符串的内容写入元素“breakdownlayer”。

我需要一种方法来传递这个字符串，或者一种 php 可以直接写入元素 'breakdownlayer' 的方法.

我只使用 php 大约 2 个月，所以我不完全确定如何让它工作，任何帮助将不胜感激。谢谢

编辑:使用下面建议的@Leif Wickland 的 JSON 想法，我为此更改了一行

print "<p id='".$Group."' class='plot' style='height:100px;width:175px;float:left;' title='".$TotalValuetoPrint."' onClick=LowerLevelPrint(".json_encode(htmlspecialchars($StringtoPrint)).")></p>";

这就是实际仪表代码随后显示的内容；

<p id="CSP" class="plot jqplot-target" p&gt;")="" km',3.4933572974895,3.243523598341,6,107.70253989446,58.222621624825)&gt;&lt;\="" km',2.7133283796449e-6,2.7133283796449e-6,6,100,4.5222139660748e-5)&gt;&lt;\="" cost="" p&gt;&lt;p="" km',11.080618560725,10.535479658845,7,105.17431497694,158.2945508675)&gt;&lt;\="" service="" per="" onmouseover="GenericLabel('OperatingCostperServiceKm',4.2798431771458,4.2520569037415,5,100.65347839959,85.596863542916)><\/p><p" onclick="LowerLevelPrint("<p" title="103.38258331775" style="height: 100px; width: 175px; float: left; position: relative;">

id、plot、title、style都正确。我是如果中间部分是 JSON 将值编码为什么。 onClick 事件似乎没有传递除 <p 以外的任何内容并且应该发送 4 个量表的段落。

Answer 1

而不是传递整个 <p>来自 PHP 的东西，PHP 应该更容易将 $TargetPerc 作为 JSON 传回。然后 JQuery 应该根据需要更新它。