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事件似乎没有传递<p以外的任何内容，并且应该发送4个量程的段落。

Answer 1

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

Answer 2

您需要确保为HTML和Javascript转义传递给JavaScript的HTML。我相信包装

$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编码，但到目前为止它的形式更好。

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

2 个答案: