Question

我创建了一个jQuery函数，该函数调用PHP服务器端文件，该文件从MySQL数据库中提取数据并以JSON格式输出。 JSON数据在此函数中被模板化，以便作为HTML文档中的列表项动态插入到DIV中。

JSON数据很好 - 我用工具验证了它，如果我在浏览器中运行PHP脚本，它会正确显示（在Chrome中使用JSONView）。但是，我无法将数据显示在HTML文档中。

我最初在PHP文件中将数据作为HTML发送，但这项工作正常，但我遇到了其他问题（plz see this SO question）所以我决定以另一种方式解决这个问题 - 使用JSON代替并模板化。

我正在尝试从数据库行添加：标签，标题，描述和＆amp; gotoURL进入透视HTML标签：

<div id="navContent">
    <li id="navItem">
        <a href="">
        <h1>Label</h1>
        <h2>Title</h2>
        <p>Dispription</p>
       </a>
   </li>
</div>

我不知道我的编码有什么问题;你能不能通过片段查看并在你的答案中进行适当的编辑。日Thnx

提供PHP：

<?php
//MySQL Database Connect
include 'mylogin.php';

mysql_select_db("myDB");
$sql=mysql_query("select * from my_list");

$output = new stdClass();

while($row = mysql_fetch_assoc($sql)) {
    $output->Some_Guidance_Library[] = $row;
}

header('Cache-Control: no-cache, must-revalidate');
header('Content-type: application/json');
echo (json_encode($output));

mysql_close();
?>

HTML文档：

<html>
. . .
<head>
. . .
<script type="text/javascript">
    . . .
    var ajaxLoader = '';
    var dns = 'http://192.168.1.34';
    var navContent = '/andaero/php/my_list.php';
    var bodyContent = '/wiki/index.php/Document #content';

    <!-- ================ When Ready Do This ============================ -->
    <!-- **************************************************************** --> 
    $(document).ready(function(){
          loadNav(dns + navContent, "navContent");//<- This gets loaded into the navContent<div
          loadPage(dns + bodyContent, "bodyContent");
     });
    . . . 
</script>
</head>
<body>
    . . .
    <div id="navScrollContainer" class="navContentPosition">
        <div id="navContent">
        <li id="navItem">
            <a href="">
            <h1>Label</h1>
            <h2>Title</h2>
            <p>Dispription</p>
            </a>
        </li>
        </div>
    </div>
    . . .
</body>
<!-- ================ Functions ===================================== -->
<!-- **************************************************************** -->
. . .
<script type="text/javascript">

    /* --------------- Handle Pg Loading ----------------- */
    function loadPage(url, pageName) {
        $("#" + pageName).load(url, function(response){
            $('#navHeaderTitle').text($(response).attr('title'));
    //          transition("#" + pageName, "fade", false);
        });
    };

    function loadNav(url, divId) {//<-- THIS FUNCTION'S BROKE!!
        $.getJSON(url, function(data){
            $.each(data, function(){
                var newItem = $('#' + divId).clone();
                // Now fill in the fields with the data
                newItem.find("h1").text(this.label);
                newItem.find("h2").text(this.title);
                newItem.find("p").text(this.description);
                newItem.find("a").text(this.gotoURL);
                // And add the new list item to the page
                newItem.children().appendTo("#navScrollContainer")
            });
            //transition(pageName, "show");
        });
    };
</script>
</html>

返回的JSON数据：

{"Regulatory_Guidance_Library":[{"_id":"1","label":"AC","title":"Advisory Circulators","description":"Provides guidance such as methods, procedures, and practices for complying with regulations and requirements.","date":"2008-03-03","gotoURL":null},{"_id":"2","label":"AD","title":"Airworthiness Directives","description":"Legally enforceable rules that apply to aircraft, aircraft engines, propellers, and appliances.","date":"2012-06-08","gotoURL":"\/wiki\/index.php\/Airworthiness_Directive"},{"_id":"3","label":"CFR","title":"Code of Federal Regulations","description":"Official Rulemaking documents of the CFR in Title 14 and have been published in the Federal Register","date":"2012-01-31","gotoURL":null},{"_id":"4","label":"PMA","title":"Parts Manufacturer Approvals","description":"Parts Manufacturer Approvals","date":"2012-01-31","gotoURL":null},{"_id":"5","label":"SAIB","title":"Special Airworthiness Info Bulletins","description":"Bulletins issued by manufacturers to provide modification or inspection instructions.","date":"2012-01-31","gotoURL":null},{"_id":"6","label":"SFAR","title":"Special Federal Aviation Regulation","description":"Official Rulemaking documents that have changed the language of the CFR in Title 14 CFR for aviation.","date":"2012-01-31","gotoURL":null},{"_id":"7","label":"STC","title":"Supplemental Type Certificates","description":"Document issued by the Federal Aviation Administration approving a product (aircraft, engine, or propeller) modification","date":"2012-01-31","gotoURL":null},{"_id":"8","label":"TSO","title":"Technical Standard Orders","description":"Minimum performance standards issued by the FAA for specified materials, parts, processes, and appliances used on civil aircraft.","date":"2012-01-31","gotoURL":null},{"_id":"9","label":"TCDS","title":"Type Certificate Data Sheets","description":"Repository of Make and Model information of aircraft, engine or propeller including airspeed, weight, and thrust limitations, etc.","date":"2012-01-31","gotoURL":null}]}

Answer 1

你永远不会在你的ajax成功解析中引用数组Some_Guidance_Library。可能更容易摆脱它。

尝试更改

$output = new stdClass();

while($row = mysql_fetch_assoc($sql)) {
    $output->Some_Guidance_Library[] = $row;
}

TO：

$output = array();

while($row = mysql_fetch_assoc($sql)) {
    $output[] = $row;
}

如果您提供了返回浏览器的json示例，那么帮助会更容易。可以直接从浏览器控制台复制

修改

基于json，您需要将$.each循环更改为：

$.each(data.Regulatory_Guidance_Library, function(){.......

来自MySQL的jQuery JSON模板

1 个答案: