Question

我是编程新手，我很难用Json和jQuery以及PHP从MySQL提供数据来填充列表。我在HTML项目中创建了一个列表：

<ul data-role="listview"
                style="width:60%; 
                       margin:0 auto; 
                       margin-top: 20px;
                       max-width: 250px;
                       -webkit-border-radius: 10px;
                       -moz-border-radius: 10px;
                       -border-radius: 10px ">     <!-- style not loading in css, applied directly-->                    
                    <li><a href="#module1">Dynamic Web Development</a></li>
                    <li><a href="#module2">Human Computing Interaction</a></li>
                    <li><a href="#module3">Introduction to Programming</a></li>
                    <li><a href="#module4">Design Principles</a></li>  
                    <li><a href="#module5">Design Practice</a></li>
                    <li><a href="#module6">Digital Audio</a></li>
                    <li><a href="#module7">Digital Signal Processing</a></li>
                    <li><a href="#module8">History of Digital Media</a></li>
                    <li><a href="#module9">Digital Asset Management</a></li>
                    <li><a href="#module10">Production Skills</a></li>
                 </ul> <!-- end modules list-->

当您点击列表中的每个项目时，它会链接到另一个页面，例如模块1：

<div id="module1"
             data-role="page">
        <div data-role="header"
             data-position='fixed'>
            <h1>Module 1</h1>
             <a href="#modules"
              data-icon="back">Modules</a>
        </div> <!--header-->    
        <div data-role="content">
            <h2 style="text-align:center;">Module specifications</h2>
            <ul data-role="listview"
                style="width: 60%; margin: 0 auto">
                <li>Module Name:</li>
                <li>Credits:</li>
                <li>Module no.:</li>
                <li>Location:</li>
                <li>Website:</li>
            </ul>

如您所见，我有一个列表，我想用PHP填充JSON格式。从我的控制台：

0: Object
credits: "15"
dueDate: "2013-05-14"
lat: "53.338545"
location: "Aungier Street"
long: "-6.26607"
moduleName: "Dynamic Web Development"
moduleNo: "999001"
room: "4037"
website: "www.dynWeb.ie"

如何使用jQuery定位列表中的那些字段？

Answer 1

您可以为列表项提供唯一的类或ID，然后在脚本中轻松定位它们。例如。在标记中添加类名：

模块名称：积分：模块号：地点：网站：

然后在脚本中：

   obj = {
        credits: "15",
        dueDate: "2013-05-14",
        lat: "53.338545",
        location: "Aungier Street",
        long: "-6.26607",
        moduleName: "Dynamic Web Development",
        moduleNo: "999001",
        room: "4037",
        website: "www.dynWeb.ie"
    };

    $(".liModuleName").html("Module Name: " + obj.moduleName);
    $(".liCredits").html("Credits: " + obj.credits);
    $(".liModuleNo").html("Module no.: " + obj.moduleNo);
    $(".liLocation").html("Location: " + obj.location);
    $(".liWebsite").html("Website: " + obj.website);

这是 DEMO

从Json（移动项目）填充数据列表

1 个答案: