有人在群里问如何在留言评论那里点击回复按钮，下面就自动显示一个回复框，他想要的效果如图：

于是我随意的写了一段HTML，代码如下：

<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.js"></script>

</head>

<ul>

    <li>

        1号用户评论

        <div>hello,我是第1条评论 2018-03-21 12:00:00 <a href="javascript:;" class="reply_btn" >回复</a></div>

    </li>

    <li>

        2号用户评论

        <div>hello,我是第2条评论 2018-03-21 12:00:00 <a href="javascript:;" class="reply_btn" >回复</a></div>

    </li>

    <li>

        3号用户评论

        <div>hello,我是第3条评论 2018-03-21 12:00:00 <a href="javascript:;" class="reply_btn" >回复</a></div>

    </li>

</ul>

<body>

    <script type="text/javascript">

        $(function(){

            //页面加载完毕后开始执行的事件

            $(".reply_btn").click(function(){

                $(".reply_textarea").remove();

                $(this).parent().append("<div class='reply_textarea'><textarea name='' cols='40' rows='5'></textarea><br/><input type='submit' value='发表' /></div>");

            });

        });

    </script>

</body>

</html>

效果如图

js实现点击评论进行显示回复框的更多相关文章

  1. js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

  2. 原生JS实现点击一个按钮显示一个div，再点击按钮div隐藏，或点击除div外其它空白处div隐藏

    <!DOCTYPE html> <html style="font-size: 24px"> <head> <title>js点击按 ...

  3. js在点击的按钮下面弹框

    效果如图,点击对应的按钮时,弹框会在对应的按钮下面显示,可以应用于列表等场景 前端代码 <%@ Page Language="C#" AutoEventWireup=&quo ...

  4. html制作，点击文字超链接显示文本框，再点击文字超链接隐藏文本框

    </head><body> <script> window.onload=function(){ document.getElementById('click'). ...

  5. JS 通过点击事件动态添加文本框

    直接拷贝到浏览器就能实现 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <htm ...

  6. Html + JS ： 点击对应的按钮，进行选择是隐藏还是显示（用户回复功能）

    例如: 当我点击按钮1时,点击第一下进行显示This is comment 01,点击第二下隐藏This is comment 01 当我点击按钮2时,点击第一下进行显示This is comment ...

  7. js控制div样式显示与隐藏，JS通过点击超链接右边（指定位置）显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

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

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

  9. 解决 ECSHOP v273 产品详情页面评论不显示的问题

    问题描述:   最近同事使用ECSHOP v273帮客户开发了一个商城系统,部署到服务器在测试的时候发现产品详情页面里测试的评论不显示,只显示了数量(其实是产品购买的次数)   因为同事搞了好长时间都 ...

随机推荐

  1. Spring Cloud Eureka 集群搭建 - 以及发现一个 “直觉BUG”

    首先解释一下标题所说的“直觉BUG”,这个是我自己的定义.就是我们直觉上认为这是一个BUG,是一个错误,而实际并没有出错. 比如下图: 虽然出现报错信息,但是,整个程序并没有出错.至于原因,图片上的文 ...

  2. 2012Hulu校园招聘笔试题

    一.填空 侧重逻辑思维,没有语言.具体技术考察,大部分属于组合数学.算法.比较基本的知识点有二元树节点树.最小生成树.Hash函数常用方法等. 二.编程题 1.正整数剖分 2.AOE关键路径 3.二元 ...

  3. 关于网页游戏断线重连的思路和demo求助

    http://bbs.9ria.com/thread-146997-1-1.html —————————————————————————————————————————————————— 1:俺有什么 ...

  4. 微信小程序——时间戳的转换及调用

    开发微信小程序网盘功能模块的时候,需要获取到网盘文件夹创建的时间.如下图: 但是请求返回的数据是一段时间戳,如下图: 所以我们只能通过js把时间戳转换成时间格式. 在小程序官网的Demo的utils. ...

  5. Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率

    有时感觉网络失去响应,就通过Ubuntu 14.04自带的系统监视器程序来查看当前网速,但是这样很不方便,遂打算让网速显示在标题栏,那样就随时可直观的看到.一番搜索尝试后,成功实现!同时也实现了CPU ...

  6. Global Pose Estimation with an Attention-based Recurrent Network

    related work包含比较多,对SLAM和最近神经网络对于定位的工作介绍比较多.

  7. QMDP-Net: Deep Learning for Planning under Partial Observability

    一篇用deep neural network做POMDP的论文

  8. c指针 --笔记2返回指针值的函数

    返回指针值的函数 一般带回指针值的函数,定义形式为: int *a (int x, int y); 看这个经典案例: #include <stdio.h> int main(int arg ...

  9. 【转载】C#之玩转反射

    前言 之所以要写这篇关于C#反射的随笔,起因有两个:   第一个是自己开发的网站需要用到   其次就是没看到这方面比较好的文章. 所以下定决心自己写一篇,废话不多说开始进入正题. 前期准备 在VS20 ...

  10. T4 好用的Vs扩展