Javascript Jquery append（）概要文件（来自服务器的数据使用$.getJSON）位于同一页面中_Javascript_Jquery_Jquery Mobile

Javascript Jquery append（）概要文件（来自服务器的数据使用$.getJSON）位于同一页面中

javascript jquery jquery-mobile

Javascript Jquery append（）概要文件（来自服务器的数据使用$.getJSON）位于同一页面中,javascript,jquery,jquery-mobile,Javascript,Jquery,Jquery Mobile,坚持使用jQuery append在同一页面中使用$.getJSON显示来自服务器的profiledata，因为我是这个平台的新手。注释掉了我卡住的区域 <body> <div id="homepage"> <button id="home">Home</button> </div> <div data-role="content" id="old_content" style="text-ali

坚持使用jQuery append在同一页面中使用$.getJSON显示来自服务器的profiledata，因为我是这个平台的新手。注释掉了我卡住的区域

<body>
    <div id="homepage">
    <button id="home">Home</button>
    </div>

    <div data-role="content" id="old_content" style="text-align: center">

        <button data-icon="arrow-d">Select Below Options</button>
        <div data-role="fieldcontain">
            <select name="select-choice-1" id="select-choice-1">
                <!-- <option>--Course--</option> -->
                <option value="mba">MBA</option>
                <option value="msc">MSc</option>
            </select>
        </div>
        <div data-role="fieldcontain">
            <select name="select-choice-1" id="select-choice-2">
                <!-- <option>--Country--</option> -->
                <option value="India">India</option>
                <option value="United Kingdom">United Kingdom</option>
                <option value="United States">United States</option>
                <option value="China">China</option>
            </select>
        </div>
        <div data-role="fieldcontain">
            <select name="select-choice-1" id="select-choice-3">
                <!-- <option>--Year--</option> -->
                <option value="2010">2010</option>
                <option value="2011">2011</option>
                <option value="2012">2012</option>
            </select>
        </div>

        <button id="go" data-theme="b">Go</button>

    </div>

    <div id="new_content">
    </div>

    <div id="profile">
    </div>


    <div data-position="fixed" data-theme="b" data-role="footer"
        data-transition="pop">
        <h4>© 2013 example.</h4>
    </div>
</div>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script
        src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
            app.initialize();
        </script>
<script type="text/javascript">
var numRecords = 5 ;
var maxPage = 0 ;
var pro = 0 ;

$course = $('#select-choice-1').val();
$country = $('#select-choice-2').val();
$year = $('#select-choice-3').val();

$(document).ready(function(){
    $("#go").click(function(){
        $("#old_content").hide();
        listStudents(0) ;
    });
    });

function listStudents(start) {

    $.getJSON( "http://example.com/api.php?course="+$course+"&year="+$year+"&country="+encodeURIComponent($country), function( data ) {
    $("#new_content").show();
    $("#new_content").html('');
    maxPage = start + numRecords ;
    for(i=start;i<=maxPage;i++)
        {
        $("#new_content").append("<ul id='new_output_content' onclick='profile("+i+")'><li><img height='50px' width='50px' src="+data[i].profile_image+'/>'+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+data[i].name+"</li></ul><br/>");
        }
    $("#new_content").prepend('<button data-theme="b" style="margin-left: 100px;margin-top: 40px;text-align: center;height: 40px;width: 153px;" data-role="button" onclick="listStudents(maxPage)">Next</button>');
    });
}

function profile(pro) {

//This is where I stuck.

var profile = "<div id='new_profile' data-role='content' align='center'><img src='"+data[pro].profile_image+"' /><br /><strong>"+data[pro].name+"</strong><br/><br/>Mail ID:<br/><strong>"+data[pro].email+"</strong><br/>Position:<br/><strong>"+data[pro].position+"</strong><br/>Course:<br/><strong>"+data[pro].course+"</strong><br/>Year of Passed Out:<br/><strong>"+data[pro].course_year+"</strong><br/>Country:<br/><strong>"+data[pro].country+"</strong><br/></div>";
    $('#profile').append(profile);
    }


$(document).ready(function(){
    $("#home").click(function(){

        $("#new_content").hide();
        $("#old_content").show();

    });
});


</script>
</body>
</html>

我想通过在单击特定学生时隐藏其他“id”来单独显示配置文件。请找人帮忙。

你能打印你收到的数据吗？首先，我想介绍另一种循环json对象的方法。。。脚本的第79行左右

fori=0；i maxPage，因此任何数据[pro]都是未定义的…

将3个InputsEntry、year、course传递到服务器文件并检索数据，这是一个对象。希望你能理解我的问题。profilepro函数内部无数据可用，因此数据[pro]。配置文件\u图像无效。我如何克服这一点并进一步前进？Thanks@V_J_S您可以将数据从jxhr[listStudents]传递到第二个函数…[profilea]只需解析getJSON从http GET接收的数据，顺便说一下。。。jquery中的变量定义如下：var variable=some_值；不是美元符号。。。您能准确地说出从第一次查询中收到的数据吗？console.logdata。我希望firefox中安装了firebub。

function profile(pro) {