Home > Web Front-end > JS Tutorial > Example analysis of line break problem of Ajax asynchronous submission data return value

Example analysis of line break problem of Ajax asynchronous submission data return value

亚连
Release: 2018-05-24 12:04:29
Original
2007 people have browsed it

This article mainly introduces the line wrapping problem of the return value of Ajax asynchronous submission data. It analyzes in detail the processing skills of the return value with line wrapping in the asynchronous submission process of Ajax in the form of examples. It has certain reference value. Friends in need You can refer to the following

example of this article to analyze the line wrapping problem of Ajax asynchronously submitted data return value. Share it with everyone for your reference, the details are as follows:

The previous analysis introduced "Javascript passing parameters based on AJAX callback function" and "The difference between IE browser and FF browser when Ajax passing parameter value is Chinese", Learned how to use ajax callback function to deal with Chinese garbled problems in different browsers. Here we will analyze the techniques for handling line breaks in ajax asynchronous submission return values.

Background introduction:

The function to be implemented is: select a category in the drop-down box, submit it to PHP and return the member names under the category according to the selected category, and return The names of each member are displayed in the textarea in the form of line breaks.

html code:

<form action="setduty.php?action=add" method="post" name="setForm" id="setForm">
<p> <label>类型:</label>
  <select name="type" id="typeduty">
  <option value="-1">选择类型</option>
  <option value="1">值班首长</option>
  <option value="2">值班处长</option>
  <option value="3">值班员</option>
  </select>
</p>
<p class="opertext"> 
    <label>成员:</label>
   <textarea name="names" id="names" cols="30" rows="10"></textarea>
</p>
Copy after login

JQuery code:

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

PHP code:

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;
}
Copy after login

The value returned in the php code directly has a newline "\n". The newline symbols of IE and FF in the textarea are both "\n". When processing the return value of jQuery, pay attention to using

newData = data.replace(/\r\n/g,&#39;&#39;);
Copy after login

The returned result is processed to remove the initial newline symbol. The value returned by Ajax automatically contains a newline. This is included with Ajax itself.

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

SSH online mall uses ajax to complete asynchronous verification of user names

The return data of ajax request Sequence problem analysis

Solution to prevent repeated sending of Ajax requests

The above is the detailed content of Example analysis of line break problem of Ajax asynchronous submission data return value. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template