jquery中的ajax基础解决方案-AJAX教程-爱易网页

jquery中的ajax基础解决方案

日期：2014-05-16　浏览次数：20750 次

jquery中的ajax基础
html代码：



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

	<head>

	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<title>jquery与ajax的应用</title>

	<style type="text/css">

		* { margin:0; padding:0;}

		body { font-size:12px;}

		.comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}

		.comment h6 { font-weight:700; font-size:14px;}

		.para { margin-top:5px; text-indent:2em;background:#DDD;}

	</style>

	<script type="text/javascript" src="scripts/jquery-1.7.2.js" ></script>

	<script type="text/javascript">

		$(function() {

                           $("#send").click(function() {



				$.post("get3.php",{ //向get3.php页面发送post请求

					username:$("#username").val(),//发送数据

					content:$("#content").val()		

				},function(data,textStatus) {  //回调函数

					var username = data.username;

					var content = data.content;

					var htmltext = "<div class='comment'><h6>"+username+"</h6><p class='para'>"+content+"</p></div>";

					$("#resText").html(htmltext);//将返回的json数据以html的形式插入到页面中

				},"json");

			});

			

		});	

	</script>

	</head>

	

	<body>

		<!---------------------- post()方法--------------------->

		<form id="form1" action="#">

		<p>评论:</p>

 		<p>姓名: <input type="text" name="username" id="username" /></p>

 		<p>内容: <textarea name="content" id="content"  rows="2" cols="20"></textarea></p>

 		<p><input type="button" id="send" value="提交"/></p>

		</form>





		<div  class='comment'>已有评论：</div>

		<div id="resText" ></div>

			

	</body>

</html>

php代码（get3.php）：



<?php 

	header("Content-Type: text/html;charset=utf-8");

	echo "{ username : \"{$_REQUEST['username']}\" , content : \"{$_REQUEST['content']}\"}" 

?>

求助：
问题：无法把回调函数中返回的数据插入到html页面中！

------解决方案--------------------



var username = data.username;

var content = data.content;

你确定这样能把值"点"出来？你返回的不是个JSON么用eval或者each或者for
就行了

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

jquery中的ajax基础解决方案

相关资料更多>

推荐阅读更多>