快捷導(dǎo)航

Ajax異步提交數(shù)據(jù)返回值的換行問(wèn)題實(shí)例分析

更新時(shí)間：2015年12月15日 11:24:07 作者：LiMXHS

這篇文章主要介紹了Ajax異步提交數(shù)據(jù)返回值的換行問(wèn)題,結(jié)合實(shí)例形式較為詳細(xì)的分析了ajax異步提交過(guò)程中返回值帶有換行的處理技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例分析了Ajax異步提交數(shù)據(jù)返回值的換行問(wèn)題。分享給大家供大家參考，具體如下：

前面分析介紹了《Javascript基于AJAX回調(diào)函數(shù)傳遞參數(shù)》及《IE瀏覽器與FF瀏覽器關(guān)于Ajax傳遞參數(shù)值為中文時(shí)的區(qū)別》，學(xué)習(xí)了ajax回調(diào)函數(shù)傳參與針對(duì)不同瀏覽器處理中文亂碼問(wèn)題的方法。這里就來(lái)分析一下ajax異步提交返回值中換行問(wèn)題的處理技巧。

背景介紹：

需要實(shí)現(xiàn)的功能是：在下拉框中選擇分類(lèi)，提交到PHP根據(jù)選擇的分類(lèi)返回該分類(lèi)下的成員名稱(chēng)，返回值各成員姓名以換行的形式顯示到textarea中。

html代碼：

<form action="setduty.php?action=add" method="post" name="setForm" id="setForm">
<p> <label>類(lèi)型：</label>
  <select name="type" id="typeduty">
  <option value="-1">選擇類(lèi)型</option>
  <option value="1">值班首長(zhǎng)</option>
  <option value="2">值班處長(zhǎng)</option>
  <option value="3">值班員</option>
  </select>
</p>
<p class="opertext"> 
    <label>成員：</label>
   <textarea name="names" id="names" cols="30" rows="10"></textarea>
</p>

JQuery 代碼：

$(document).ready(function(){
 $("#typeduty").change(function(){
  var type = $("#typeduty").val();
  $.post("setduty_do.php",
   {
    'cid' : type,
   },function(data,status){
    newData = data.replace(/\r\n/g,'');
     $("#names").html(newData);
  });
 });
});

PHP代碼：

if($type){
 switch($type){
  case "1":
   $arrs = getChiefList();
  break;
  case "2":
   $arrs = getDirectList();
  break;
  case "3":
   $arrs = getAttendantList();
  break;
  default:
  break;
 }
 $arr_names = "";
 foreach($arrs as $arr){
  if(strlen($arr[1])>2){
   $arr_names.= $arr[1]."\n";
  }
 }
 echo $arr_names;
}

php代碼中返回的值直接帶有換行“\n”，textarea 中IE和FF的換行符號(hào)都是 "\n",jQuery 的處理返回值中注意，使用

復(fù)制代碼代碼如下:

newData = data.replace(/\r\n/g,'');

處理返回的結(jié)果，用于去除最開(kāi)始的換行符號(hào)，Ajax返回的值中，都自動(dòng)帶有一個(gè)換行。這是Ajax本身帶有的。

希望本文所述對(duì)大家ajax程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

ajax數(shù)據(jù)傳輸方式實(shí)例詳解
這篇文章主要介紹了ajax數(shù)據(jù)傳輸方式,結(jié)合實(shí)例形式較為詳細(xì)的分析總結(jié)了ajax數(shù)據(jù)傳輸?shù)脑砼c傳輸文本、xml及json格式數(shù)據(jù)的具體實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-12-12
快速解決ajax傳遞為空但顯示在頁(yè)面上為undefined的問(wèn)題
今天小編就為大家分享一篇快速解決ajax傳遞為空但顯示在頁(yè)面上為undefined的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-08-08
使用加載圖片解決在Ajax數(shù)據(jù)加載中頁(yè)面出現(xiàn)短暫空白的問(wèn)題(推薦)
在項(xiàng)目中用ajax異步獲取數(shù)據(jù)后有時(shí)會(huì)因?yàn)閿?shù)據(jù)問(wèn)題或者網(wǎng)絡(luò)問(wèn)題，頁(yè)面一直顯示空白，現(xiàn)在用加載圖片來(lái)過(guò)渡這種狀態(tài)，具體實(shí)例代碼通過(guò)本文一起學(xué)習(xí)吧
2016-12-12
MPBrowser簡(jiǎn)易圖片瀏覽器 v1.0
MPBrowser簡(jiǎn)易圖片瀏覽器 v1.0...
2006-09-09
原生ajax調(diào)用數(shù)據(jù)實(shí)例講解
這篇文章主要向大家介紹了原生ajax調(diào)用數(shù)據(jù)實(shí)例，具有一定的參考價(jià)值，感興趣的朋友可以參考一下
2016-01-01
xajax的FORM例子
xajax的FORM例子...
2006-11-11
ajax+asp無(wú)限級(jí)分類(lèi)樹(shù)型結(jié)構(gòu)的代碼
ajax+asp無(wú)限級(jí)分類(lèi)樹(shù)型結(jié)構(gòu)的代碼...
2007-10-10
Ajax與JSON的一些學(xué)習(xí)總結(jié)
Ajax技術(shù)的核心是XMLHttpRequest對(duì)象（簡(jiǎn)稱(chēng)XHR），可以通過(guò)使用XHR對(duì)象獲取到服務(wù)器的數(shù)據(jù)，然后再通過(guò)DOM將數(shù)據(jù)插入到頁(yè)面中呈現(xiàn)。雖然名字中包含XML，但Ajax通訊與數(shù)據(jù)格式無(wú)關(guān)，所以我們的數(shù)據(jù)格式可以是XML或JSON等格式
2012-08-08
JQuery中$.ajax()方法參數(shù)詳解
AJAX即“Asynchronous Javascript And XML”（異步JavaScript和XML），是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)。本文跟大家介紹JQuery中$.ajax()方法參數(shù)詳解，小伙伴們一起學(xué)習(xí)吧
2015-10-10
ajax請(qǐng)求json數(shù)據(jù)案例詳解
最近項(xiàng)目有這樣一個(gè)需求，點(diǎn)擊六大洲，出現(xiàn)對(duì)應(yīng)的一些請(qǐng)求信息，展示在下面，當(dāng)請(qǐng)求之后，第二次點(diǎn)擊就不用再次請(qǐng)求了，究竟用代碼怎么寫(xiě)呢，下面小編帶領(lǐng)大家了解了解
2015-09-09