日期:2014-05-16 浏览次数:20395 次
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>测试</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("#answer").mouseleave(function(){$(this).hide();}); $("#qList a").click(function(){ var left=$(this).offset().left; var top=$(this).offset().top; $("#answer") .css({"left":left,"top":top}) .html('<input type="text" value="" id="reply"><input type="button" id="btn" value="确定"> ') .show(); $("#reply:focus");//设置输入框焦点 var id=$(this).attr("id");//问题的ID $("#btn").click(function(){ var answer=$("#reply").val(); alert("问题的ID为:"+id); alert("回复的内容为:"+answer); $.ajax({ type: "post", cache: false, url: "b.php", data:"id="+id+"&answer="+answer+"",//具体的参数规格你按自己的改就是了 beforeSend: function () {}, success: function (data) { alert(data);//data即为你b.php返回的值;再把b.php页面返回的值c弹出显示出来 $("#answer").hide();//隐藏回复 }, error: function (http) {alert("发生错误")}, complete: function (http) { } }); }) }) }) </script> </head> <body> <div id="qList"> 问题1?<a href="javascript:void(0);" id="1">回复</a> 问题2?<a href="javascript:void(0);" id="2">回复</a> 问题3?<a href="javascript:void(0);" id="3">回复</a> 问题4?<a href="javascript:void(0);" id="4">回复</a> </div> <div id="answer" style=" position:absolute;display:none;border:1px solid #bfbfbf;width:200px;height:50px; background:#fff"> </body> </html>