首页 >web前端 >js教程 >在jQuery中如何获取数据赋值给页面

在jQuery中如何获取数据赋值给页面

亚连
亚连原创
2018-06-14 15:06:462379浏览

下面我就为大家分享一篇jQuery中ajax获取数据赋值给页面的实例,具有很好的参考价值,希望对大家有所帮助。

实例如下所示:

//html代码 
<pre name="code" class="html"><a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" class="cityname" id="{$rr[code]}" name=&#39;{$rr[name]}&#39;>{$rr[name]}</a>

 

//控制器代码 
$courseArrs = json_decode(trim($courseArrs,chr(239).chr(187).chr(191)),true); 
$newData[&#39;courseArrs&#39;] = $courseArrs[&#39;data&#39;]; 
echo json_encode(array(&#39;state&#39; => 1,&#39;data&#39;=>$newData));die;

//ajax代码 
<script type="text/javascript"> 
  //地区ajax获取数据 
  $(function(){ 
   $(".cityname").click(function(){ 
    var code = $(this).attr("id"); 
    var name = $(this).attr("name"); 
    $(&#39;#city_name&#39;).html(name); 
    var course_info =&#39;&#39;; 
    var url="?m=content&c=cityPoster&a=wenduNewsInfos"; 
    $.ajax({ 
     type: "GET", 
     url: url, 
     data: {cityId:code},   
     dataType: "json", 
     async:false, 
     success: function(data){ 
     course_info=data.data.posterArrs;//公告返回结果 
     course_arr=data.data.courseArrs;//课程返回结果 
 
     console.log(course_info); 
 
     return false; 
     html = &#39;&#39;; 
     },  
    }); 
    //课程ajax请求结果赋值 
    //考研公共课 
    var data_ggk=course_arr[0]; 
    var kyhtml=&#39;&#39;; 
    kyhtml+=&#39; <p class="local_courseLeft">&#39;; 
    if(data_ggk==&#39;&#39;){  
     kyhtml+=&#39;<p class="second_interview">&#39;; 
     kyhtml+=&#39;<p class="other-choose">您可选择附近城市的分校课程<br>&#39;; 
     kyhtml+=&#39; 也可以选择网校,在线学习<a class="enter_official" target="_blank" href="http://www.wenduedu.com/" rel="external nofollow" >进入文都网校</a></p>&#39;; 
     kyhtml+=&#39; <p class="official_telphone">400-606-9976</p>&#39;; 
     kyhtml+=&#39;</p>&#39;;  
    }else if(data_ggk.length){ 
    var length0=data_ggk.length; 
    for(var i=0;i< length0;i++){ 
     kyhtml+=&#39;<p class="local_courseList">&#39;; 
     kyhtml+=&#39;<p class="localCourse_heading"><a href="&#39;+data_ggk[i].url+&#39;" rel="external nofollow" rel="external nofollow" title="&#39;+data_ggk[i].title+&#39;" target="_blank">&#39;+data_ggk[i].title+&#39;</a></p>&#39;; 
     kyhtml+=&#39;<p class="localCourse-introduce">&#39;; 
     kyhtml+=&#39;<span class="courseIntroduce-title">课程简介:</span>&#39;; 
     kyhtml+=&#39;<a class="localCourse-others localCourse-details" title="&#39;+data_ggk[i].description+&#39;" >&#39;+data_ggk[i].description+&#39;</a>&#39;; 
     kyhtml+=&#39;</p>&#39;; 
     kyhtml+=&#39;<p class="localCourse-introduce teach-master">&#39;; 
     kyhtml+=&#39;<span class="courseIntroduce-title">授课名师:</span>&#39;; 
     kyhtml+=&#39;<a class="localCourse-others teacher_Name" title="&#39;+data_ggk[i].teacher+&#39;">&#39;+data_ggk[i].teacher+&#39;</a>&#39;; 
     kyhtml+=&#39;</p>&#39;; 
     kyhtml+=&#39;<p class="localCourse_Enter">&#39;; 
     kyhtml+=&#39;<p class="remian-days">报名剩余&#39;+data_ggk[i].sign_end+&#39;天</p>&#39;; 
     kyhtml+=&#39;<a href="&#39;+data_ggk[i].url+&#39;" rel="external nofollow" rel="external nofollow" target="_blank" class="course-consult">报名咨询</a>&#39;; 
     kyhtml+=&#39;</p>&#39;; 
     kyhtml+=&#39;</p>&#39;; 
     } 
    } 
    kyhtml+=&#39;</p>&#39;; 
    //公告 
     kyhtml+=&#39;<p class="localCourse-notice">&#39;; 
     kyhtml+=&#39;<h3 class="common-titleModule common-titleModuleWD">&#39;; 
     kyhtml+=&#39;<a target="_blank" class="commonTitle_name" href="javascript:void(0)" rel="external nofollow" rel="external nofollow" >公告</a><b class="commonTitle-line"></b></h3>&#39;; 
     kyhtml+=&#39;<ul class="localCourse-noticeList">&#39;; 
     for(var coursePer in course_info[0]){ 
     kyhtml+=&#39;<li><a target="_blank" href="&#39;+course_info[0][coursePer].url+&#39;" rel="external nofollow" >&#39;+course_info[0][coursePer].title+&#39;</a></li>&#39;; 
     } 
     kyhtml += &#39;</ul>&#39;; 
     kyhtml+=&#39;</p>&#39;; 
    $(&#39;#ggk&#39;).html(&#39;&#39;); 
    $(&#39;#ggk&#39;).html(kyhtml); 
}); 
  }) 
</script>


上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

使用tangram.js库如何实现js类

利用js代码如何实现复制功能

使用JavaScript如何实现音频播放功能

javascript中如何使用replace函数

js数组reduce的相关用法

如何编写有质量的JS代码

MySQL修改root密码

使用Node.js如何实现资讯爬虫(详细教程)

以上是在jQuery中如何获取数据赋值给页面的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn