jq用户评论点击回复简单代码。
类似这种镶套回复评论:

<div>
<ul>
<!--一条评论 begin-->
<li>
<div class="user-column">
<div class="user-reply">
<a class="c-grey2 small" href="javascript:void(0);"><span class="reply-icon reply"></span><span class="to-reply" href="javascript:void(0);">回 复</span> </a>
<a class="c-grey2 small" href="javascript:void(0);"><span class="reply-icon look-reply"></span><span class="show-reply" href="javascript:void(0);">查看回复(<em>7</em>)</span></a>
</div>
<!--span10 begin-->
<div class="span10">
<div class="show-comment-box" style="display: none;">
<div class="deshed-arrow">
<img src="data:images/solid_arrow.jpg"/>
</div>
<div class="comment-pan">
<textarea name="content" rows="" maxlength="300"></textarea>
<span class="publish">回 复</span>
</div>
</div>
</div>
<!--span10 end-->
<!--span10 begin-->
<div class="span10">
<!-- 用户回复 begin-->
<div class="user-column-reply" style="display: none;">
<div class="deshed-arrow">
<img src="data:images/dashed_arrow_up.jpg"/>
</div>
<ul class="comment-list">
<li> <div class="user-column">
<div class="user-reply">
<a class="c-grey2 small" href=""><span class="reply-icon like"></span>(<em>702</em>)</a>
<a class="c-grey2 small" href="javascript:void(0);">
<span class="reply-icon reply"></span>
<span class="to-reply" href="javascript:void(0);">回 复</span>
</a>
</div>
<!--span10 begin-->
<div class="span10">
<div class="show-comment-box" style="display: none;">
<div class="comment-pan">
<textarea name="content" rows="" maxlength="300"></textarea>
<span class="publish">回 复</span>
</div>
</div>
</div>
<!--span10 end-->
</li>
</ul>
</div>
<!--用户回复 end--> </li>
<!--一条评论 end-->
</ul>
</div>
JQ代码:
<script type="text/javascript">
//点击回复 $(".show-reply").click(function() {//点击回复
var $i = $(this);
if ($i.text() != "收起回复") {
$i.data("text", $i.text());
$i.text("收起回复");
} else $i.text($i.data("text"));
$i.closest(".user-column").find(".user-column-reply").toggle();
})
$(".to-reply").click(function() {//点击回复
var $i = $(this);
if ($i.text() != "暂不回复") {
$i.data("text", $i.text());
$i.text("暂不回复");
} else $i.text($i.data("text"));
$i.closest(".user-reply").next().find(".show-comment-box").toggle();
}) </script>
jq用户评论点击回复简单代码。的更多相关文章
- C#截取用户的点击事件的代码
在代码过程中中,把做工程过程中常用的代码备份一下,如下代码内容是关于C#截取用户的点击事件的代码,应该是对大家也有好处. private void SomeControl_KeyDown(object ...
- iOS之防止用户重复点击Button(按钮)问题
在项目中,我们往往会遇到这样的问题:因为网络较慢的原因,用户会不耐烦的一直去点击按钮,这样导致的结果时:相关代码一遍一遍的被重复执行,如果按钮的事件是网络请求的话,这样又导致一种网络请求的循环.所以我 ...
- js实现点击评论进行显示回复框
有人在群里问如何在留言评论那里点击回复按钮,下面就自动显示一个回复框,他想要的效果如图: 于是我随意的写了一段HTML,代码如下: <!DOCTYPE HTML> <html lan ...
- 模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(上)
我们大部分人都发过动态,想必都知道发动态.回复评论.删除动态的整个过程,那么作为初学者,要模仿这些功能有点复杂的,最起码表的关系得弄清楚~~ 先把思路理一下: (1)用户登录,用session读取 ...
- python 全栈开发,Day82(点赞和踩灭,用户评论)
一.点赞和踩灭 样式 先来做样式,修改article_detail.html,增加div_digg的div {% extends "base.html" %} {% block c ...
- Nodejs之MEAN栈开发(九)---- 用户评论的增加/删除/修改
由于工作中做实时通信的项目,需要用到Nodejs做通讯转接功能,刚开始接触,很多都不懂,于是我和同事就准备去学习nodejs,结合nodejs之MEAN栈实战书籍<Getting.MEAN.wi ...
- Node.js实现用户评论社区(体验前后端开发的乐趣)
前面 接着上一节的内容来,今天我们要完成一个用Node开发后台服务器,实现一个简单的用户评论社区.可以先看下效果图: 开始 建立项目文件夹comment-list,在里面新建一个public文件夹,p ...
- Redis:安装、配置、操作和简单代码实例(C语言Client端)
Redis:安装.配置.操作和简单代码实例(C语言Client端) - hj19870806的专栏 - 博客频道 - CSDN.NET Redis:安装.配置.操作和简单代码实例(C语言Client端 ...
- 查找和定位Android应用的按钮点击事件的代码位置基于Xposed Hook实现
本文博客地址:https://blog.csdn.net/QQ1084283172/article/details/80956455 在进行Android程序的逆向分析的时候,经常需要通过Androi ...
随机推荐
- Hadoop1重新格式化HDFS
注意:原来的数据全部被清空了.产生了一个新的hdfs 1. 删除已有目录 1.1 查看hdfs-site.xml 将 dfs.name.dir和dfs.data.dir所指定的目录删除 vim hdf ...
- Amphetamine的cf日记
之前挂上的 今天填坑 2018.2.14 #462 A 给两个集合,B分别可以从一个集合中选一个数,B想乘积最大,A想最小,A可以删除一个第一个集合中的元素,问最小能达到多少. 这题..水死啦.我居然 ...
- 【OpenCV】SIFT原理与源码分析:方向赋值
<SIFT原理与源码分析>系列文章索引:http://www.cnblogs.com/tianyalu/p/5467813.html 由前一篇<关键点搜索与定位>,我们已经找到 ...
- swagger2的常用注解,传递参数的注意使用方法
背景介绍: 刚开始的时候,在controller层使用@RequestParam的时候,发现这个参数是必须要输入值的,但是我们有时候必须查询的时候允许参数为空,使用这个注解就不行了. 在集成了swag ...
- git 删除远程仓库的命令
# 删除远程仓库的命令: git branch -r -d origin/branch-name #其中这条命令必须执行,远程仓库才会删除 git push origin :branch-name # ...
- AI技术说:人工智能相关概念与发展简史
作为近几年的一大热词,人工智能一直是科技圈不可忽视的一大风口.随着智能硬件的迭代,智能家居产品逐步走进千家万户,语音识别.图像识别等AI相关技术也经历了阶梯式发展.如何看待人工智能的本质?人工智能的飞 ...
- varchar字段
varchar 最长26000多,实际使用最好不要超过255,会占内存 可以考虑text
- OpenCV---图像直方图
一:直方图的直接使用 from matplotlib import pyplot as plt def plot_demo(image): print(image.ravel()) plt.hist( ...
- Do the Untwist(模拟)
ZOJ Problem Set - 1006 Do the Untwist Time Limit: 2 Seconds Memory Limit: 65536 KB Cryptography ...
- [转]C/C++作用域详解
原文地址:http://www.cnblogs.com/yc_sunniwell/archive/2010/07/14/1777433.html 作用域规则告诉我们一个变量的有效范围,它在哪儿创建,在 ...