将 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 个月，所以我不完全确定如何才能让它工作，任何帮助将不胜感激。 谢谢

编辑：使用下面建议的 JSON 想法 @Leif Wickland 我已经将一行更改为这

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、情节、标题和风格都正确。我想如果中间部分是 JSON 将值编码为的内容。 onClick 事件似乎没有传递除 之外的任何内容，并且应该发送 4 个计量单位的段落。

Answer 1

对于 PHP 来说，将 $TargetPerc 作为 JSON 传回应该更容易，而不是从 PHP 传递整个

内容。然后 JQuery 应根据需要更新它。

Answer 2

您需要确保传递给 JavaScript 的 HTML 对于 HTML 和 Javascript 都进行了转义。我相信

$StringtoPrint

通过调用来

json_encode(htmlspecialchars($StringtoPrint))

解决您的问题。因此，整行代码将如下所示：

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

您需要在 PHP 5.2 或更高版本上运行才能拥有 json_encode 可用。严格来说，没有必要使用 htmlspecialchars 对标记进行 HTML 编码，但迄今为止这是更好的形式。