<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>.html</title>
<style>
*{margin:0;padding:0}
#baidu{width:35%;margin:20px auto}
.comment{display:block;cursor:pointer;color:#369}
hr{width:98%;color:#ccc;margin:0 0 5px 0;}
.comment_list{border:1px solid #ccc;padding:0 5px;}
.public{border:1px solid #ccc;padding:0 5px;display:none;}
.txt{width:96%;margin:5px 0 0 5px;}
.pluc{width:98%;text-align:right;}
.btn{width:50px;cursor:pointer}
</style>
<script src="jquery-1.7.2.min.js"></script>
<script>
$(function(){
var div=$("div");
for(var i=0;i<div.length;i++){
var a=$("<span class='comment'>0条评论</span><hr><div class='comment_list'></div><div class='public'></div>");//注意：这个a变量必须在for里面
div.eq(i).append(a);
} //if(!$("div").has("form").length){}表示当div里form个数为0的话，就。。。
$(".comment").each(function(index,value){
$(this).on("click",function(){
if(!$(".public").eq(index).has("form").length){//如果里面还没有添加进来
$.ajax({
type:"post",
url:"",
beforeSend:function(){//发送之后，成功之前
$(".public").eq(index).append("<dl class='loadding'><dd>正在加载评论</dd></dl>");
}
success:function(data){
$(".public").eq(index).find("loadding").hide();//加载成功之后把它隐藏起来
//然后解析反回来的数据,显示在对应的主题下方
$("data").each(function(index,value){
$(".comment_list").eq(index).append("<dl><dt class='who'>"+value.user+"</dt><dd>"+value.comment+"</dd><dd='date'>"+value.date+"</dd><hr></dl>");
}); //然后显示发表区
$(".public").eq(index).append("<form><textarea class='txt'></textarea><p class='pluc'><button class='btn'>发表</button></p></form>");
//然后，当点击发表按钮的时候，发送ajax表单请求
$(".public").eq(index).find(".btn").click(function(){
$.ajax({
type:'post',
url:'',
data:$($(".public").eq(index).find("form")).serialize()，
success：function(data){
if (data) {
$(_this).button('enable');
$('#loading').css('background', 'url(img/success.gif) no-repeat 20px center').html('数据新增成功...');
}
}
});

});
}
});

if($(".public").eq(index).is(':hidden')){
$(".public").eq(index).show();
}else{
$(".public").eq(index).hide();
}
}


});
});
});

</script>
</head>
<body>
<div id="baidu">
<div class="one">百度联盟内容生态亮相魔都 以内容引爆流量价值</div>

<div class="two">百度糯米影业打通影视和生活服务消费市场</div>

<div class="three">人工智能让营销更懂人心 百度接连斩获营销界实力大奖</div>
</div>

</body>
</html>

ajax发布评论 、显示评论的更多相关文章

  1. 模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能（上）

      我们大部分人都发过动态,想必都知道发动态.回复评论.删除动态的整个过程,那么作为初学者,要模仿这些功能有点复杂的,最起码表的关系得弄清楚~~ 先把思路理一下: (1)用户登录,用session读取 ...

  2. 课堂Beta发布140字评论

    Beta发布140字评论: 第一组:飞天小女警 此项目组的功能是礼物挑选,创意十足,用户只要一听名字便会被深深吸引,并且页面设计感,时尚感十足,不断吸引客户的眼球,而且发布到云服务器上面. 第二组:金 ...

  3. Fireeye火眼公司发布报告，评论中国网络间谍活动

    2013年10月2日,Fireeye火眼公司发布报告,评论中国网络间谍活动-Fireeye(美 国火眼公司)发布报告<世界网络大战:理解网络攻击背后的国家意图>(World War C: ...

  4. 修正zen cart商品评论显示太短的问题

    找到includes\modules\pages\product_reviews\header_php.php $reviews_query_raw = “SELECT r.reviews_id, l ...

  5. SpringBoot开发十八-显示评论

    需求介绍 显示评论,还是我们之前做的流程. 数据层:根据实体查询一页的评论数据,以及根据实体查询评论的数量 业务层:处理查询评论的业务,处理查询评论数量的业务 表现层:同时显示帖子详情数据时显示该帖子 ...

  6. BBS-文章详情页、评论、评论树

    1.简单的实现评论功能 article_detail.html,拿到数据  由路--给视图函数--写入数据库 <p>评论内容:</p> <textarea name=&q ...

  7. jsonp、瀑布流布局、组合搜索、多级评论（评论树）、Tornado初识

    1.JSONP原理剖析以及实现 1.1 同源策略限制 用django分别建立两个项目,jsonp01和jsonp02,然后再在这两个项目里分别建立一个app,比如名字叫jsonp1.jsonp2:js ...

  8. 微信支付 发布后显示 System:access_denied

    微信支付发布后显示 System:access_denied (android)或 System:not_allow(IOS) 我们项目用的是.NET MVC3 授权目录是:http://mynetd ...

  9. Ajax接收并显示后台传来的list集合内的数据信息

    最近在学习Ajax做一个留言系统的时候碰到需要将list集合从后台传到前台ajax接收并显示的情况,在网上搜了很多,但很多情况都不是和我遇见的情况一样的,现在,直接贴出我的问题及解决方法. 后台代码: ...

  10. jquery Ajax请求中显示Loading...

    jquery Ajax请求中显示Loading... $('#btnTest').click(function(){      $.ajax({           url ---- ,根据你需要设置 ...

随机推荐

  1. eclipse+maven 无法编译

    Archive for required library: 'F:/mavenLib/org/mybatis/mybatis/3.4.1/mybatis-3.4.1.jar' in project ' ...

  2. Paratroopers

    Paratroopers Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 7881 Accepted: 2373 Descript ...

  3. 2016CCPC东北地区大学生程序设计竞赛 1008 HDU5929

    链接http://acm.hdu.edu.cn/showproblem.php?pid=5929 题意:给你一种数据结构以及操作,和一种位运算,最后询问:从'栈'顶到低的运算顺序结果是多少 解法:根据 ...

  4. Mysql-学习笔记（==》事件 十二）

    事件 计划任务(定期定时执行) -- 查看当前mysql数据库是否开启时间功能,默认关闭SHOW VARIABLES LIKE 'event_scheduler'; -- event_schedule ...

  5. 2016年10月27日 星期四 --出埃及记 Exodus 19:12

    2016年10月27日 星期四 --出埃及记 Exodus 19:12 Put limits for the people around the mountain and tell them, `Be ...

  6. Python3基础 len函数 获得一个字符串的字符个数

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  7. MSM8909平台 LED背光的控制

    之前齐师兄问我,是不是应该有一个文件记录背光灯的亮度,我说理论上有,但是在哪里我真的还没有见过.只知道在调LCD驱动的时候会调用一个背光控制的函数,传进来一个亮度值就可以配置亮度了,至于这个函数是谁调 ...

  8. django 的auth.authenticate返回为None

    使用auth.authenticate(username= username,passowrd=passowrd),这个用户认证时候,明明数据库中有记录,但是返回就None 我的错误点比较多: 1.我 ...

  9. Beaglebone Black 和树莓派

    我不是创客.我买了个 Beaglebone Black 来玩,主要是拿来学习. 入手前,看过好几个树莓派 (Raspi - 2 Model B)和 Beaglebone Black (BBB) 比较, ...

  10. JAVA帮助文档全系列 JDK1.5 JDK1.6 JDK1.7 官方中英完整版下载

    JAVA帮助文档全系列 JDK1.5 JDK1.6 JDK1.7 官方中英完整版下载JDK(Java Development Kit,Java开发包,Java开发工具)是一个写Java的applet和 ...