데이터를 가져와 jQuery에서 페이지에 할당하는 방법

아래에서는 ajax를 사용하여 데이터를 가져와 jQuery의 페이지에 할당하는 예제를 공유하겠습니다. 이는 좋은 참조 값을 갖고 있으며 모든 사람에게 도움이 되기를 바랍니다.

예제는 다음과 같습니다.

//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['courseArrs'] = $courseArrs['data']; 
echo json_encode(array('state' => 1,'data'=>$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를 이용하여 오디오 재생 기능 구현하기

replace 사용 방법 javascript의 함수

js 배열 감소의 관련 사용법

품질이 뛰어난 JS 코드를 작성하는 방법

MySQL이 루트 비밀번호를 변경합니다

Node.js를 사용하여 정보 크롤러를 구현하는 방법(자세한 튜토리얼)

위 내용은 데이터를 가져와 jQuery에서 페이지에 할당하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!