首頁 web前端 js教程 在jQuery中ajax怎樣提取資料的賦值

在jQuery中ajax怎樣提取資料的賦值

Mar 15, 2018 pm 01:09 PM
ajax jquery 數據

這次帶給大家在jQuery中ajax怎樣提取資料的賦值,在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['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"); 
    $('#city_name').html(name); 
    var course_info =''; 
    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 = ''; 
     },  
    }); 
    //课程ajax请求结果赋值 
    //考研公共课 
    var data_ggk=course_arr[0]; 
    var kyhtml=''; 
    kyhtml+=' <p class="local_courseLeft">'; 
    if(data_ggk==''){  
     kyhtml+='<p class="second_interview">'; 
     kyhtml+='<p class="other-choose">您可选择附近城市的分校课程<br>'; 
     kyhtml+=' 也可以选择网校,在线学习<a class="enter_official" target="_blank" href="http://www.wenduedu.com/" rel="external nofollow" >进入文都网校</a></p>'; 
     kyhtml+=' <p class="official_telphone">400-606-9976</p>'; 
     kyhtml+='</p>';  
    }else if(data_ggk.length){ 
    var length0=data_ggk.length; 
    for(var i=0;i< length0;i++){ 
     kyhtml+=&#39;<p class="local_courseList">'; 
     kyhtml+='<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">'+data_ggk[i].title+'</a></p>'; 
     kyhtml+='<p class="localCourse-introduce">'; 
     kyhtml+='<span class="courseIntroduce-title">课程简介:</span>'; 
     kyhtml+='<a class="localCourse-others localCourse-details" title="&#39;+data_ggk[i].description+&#39;" >'+data_ggk[i].description+'</a>'; 
     kyhtml+='</p>'; 
     kyhtml+='<p class="localCourse-introduce teach-master">'; 
     kyhtml+='<span class="courseIntroduce-title">授课名师:</span>'; 
     kyhtml+='<a class="localCourse-others teacher_Name" title="&#39;+data_ggk[i].teacher+&#39;">'+data_ggk[i].teacher+'</a>'; 
     kyhtml+='</p>'; 
     kyhtml+='<p class="localCourse_Enter">'; 
     kyhtml+='<p class="remian-days">报名剩余'+data_ggk[i].sign_end+'天</p>'; 
     kyhtml+='<a href="&#39;+data_ggk[i].url+&#39;" rel="external nofollow" rel="external nofollow" target="_blank" class="course-consult">报名咨询</a>'; 
     kyhtml+='</p>'; 
     kyhtml+='</p>'; 
     } 
    } 
    kyhtml+='</p>'; 
    //公告 
     kyhtml+='<p class="localCourse-notice">'; 
     kyhtml+='<h3 class="common-titleModule common-titleModuleWD">'; 
     kyhtml+='<a target="_blank" class="commonTitle_name" href="javascript:void(0)" rel="external nofollow" rel="external nofollow" >公告</a><b class="commonTitle-line"></b></h3>'; 
     kyhtml+='<ul class="localCourse-noticeList">'; 
     for(var coursePer in course_info[0]){ 
     kyhtml+='<li><a target="_blank" href="&#39;+course_info[0][coursePer].url+&#39;" rel="external nofollow" >'+course_info[0][coursePer].title+'</a></li>'; 
     } 
     kyhtml += '</ul>'; 
     kyhtml+='</p>'; 
    $('#ggk').html(''); 
    $('#ggk').html(kyhtml); 
}); 
  }) 
</script>

 
登入後複製

相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

推薦閱讀:

HTML+CSS+jQuery實作輪播廣告圖

html+css+jquery實作樓層捲動效果

jquery怎樣做出分頁效果

以上是在jQuery中ajax怎樣提取資料的賦值的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

使用ddrescue在Linux上恢復數據 使用ddrescue在Linux上恢復數據 Mar 20, 2024 pm 01:37 PM

使用ddrescue在Linux上恢復數據

開源!超越ZoeDepth! DepthFM:快速且精確的單目深度估計! 開源!超越ZoeDepth! DepthFM:快速且精確的單目深度估計! Apr 03, 2024 pm 12:04 PM

開源!超越ZoeDepth! DepthFM:快速且精確的單目深度估計!

超級智能體生命力覺醒!可自我更新的AI來了,媽媽再也不用擔心資料瓶頸難題 超級智能體生命力覺醒!可自我更新的AI來了,媽媽再也不用擔心資料瓶頸難題 Apr 29, 2024 pm 06:55 PM

超級智能體生命力覺醒!可自我更新的AI來了,媽媽再也不用擔心資料瓶頸難題

Google狂喜:JAX性能超越Pytorch、TensorFlow!或成GPU推理訓練最快選擇 Google狂喜:JAX性能超越Pytorch、TensorFlow!或成GPU推理訓練最快選擇 Apr 01, 2024 pm 07:46 PM

Google狂喜:JAX性能超越Pytorch、TensorFlow!或成GPU推理訓練最快選擇

iPhone上的蜂窩數據網路速度慢:修復 iPhone上的蜂窩數據網路速度慢:修復 May 03, 2024 pm 09:01 PM

iPhone上的蜂窩數據網路速度慢:修復

美國空軍高調展示首個AI戰鬥機!部長親自試駕全程未乾預,10萬行代碼試飛21次 美國空軍高調展示首個AI戰鬥機!部長親自試駕全程未乾預,10萬行代碼試飛21次 May 07, 2024 pm 05:00 PM

美國空軍高調展示首個AI戰鬥機!部長親自試駕全程未乾預,10萬行代碼試飛21次

首個自主完成人類任務機器人出現,五指靈活速度超人,大模型加持虛擬空間訓練 首個自主完成人類任務機器人出現,五指靈活速度超人,大模型加持虛擬空間訓練 Mar 11, 2024 pm 12:10 PM

首個自主完成人類任務機器人出現,五指靈活速度超人,大模型加持虛擬空間訓練

阿里7B多模態文件理解大模型拿下新SOTA 阿里7B多模態文件理解大模型拿下新SOTA Apr 02, 2024 am 11:31 AM

阿里7B多模態文件理解大模型拿下新SOTA

See all articles