JS留言功能的简单实现案例(推荐)
JS留言功能的简单实现案例(推荐)
<!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=utf-8" /> <title>无标题文档</title> <script src="jquery-1.11.2.min.js"></script>//接入jquery包 </head> <body> <div id="nr"> </div> <div> 内容:<textarea id="txt"></textarea> <br /> <input type="button" value="提交" id="btn" /> </div> </body> <script type="text/javascript"> //给提交按钮加入点击事件 $(document).ready(function(e) { //找到ID=btn的按钮加入一个click事件 $("#btn").click(function(){ //首先要找到文本域里面的值 var nt = $("#txt").val();//取出用户在文本域里面输入的valuer值并且交给一个变量nt var str = nt+"<br>";//在用户输入的内容后面追加换行 //把拼接好的字符串(nt+"<br>")扔到最上方ID为nr的DIV里面去 $("#nr").append(str); }) }); </script> </html>
以上就是小编为大家带来的JS留言功能的简单实现案例(推荐)全部内容了,希望大家多多支持我们~
相关推荐
-
JavaScript 轻松搞定快捷留言功能 只需一行代码
别急,方法非常简单,还是先听我说说它的来历吧... 最开始,快捷留言这个功能要追溯到发表[AjaxControlToolkitTests自动测试框架完全解析之一:架构篇]这篇文章的时候,当时它纯粹是那篇文章的副产品,本来没太在意,本想只是给像我一样的懒人准备的一条捷径而已,后来因为没有提示这个功能会直接自动提交留言,还引起了几枚同学的不满意,于是后来又在醒目位置加上了提示:[提示:快捷链接会直接推荐并提交留言信息.],才平息了局势: 再后来,有部分同学可能是鼠标太高级,连击速度特别快的原因,每次
-
JS留言功能的简单实现案例(推荐)
JS留言功能的简单实现案例(推荐) <!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-eq
-
JS Loading功能的简单实现
我们经常在浏览网页的时候会看到数据在加载时,出现的LOADING提示.其实这个功能原理是很简单的,就是一个DIV遮盖当前页面,然后Loading就在遮盖DIV层上展示出来,现在我们来动手实现一下. 1.当前页面: 复制代码 代码如下: <div class="current"><a href="#" onclick="showLoading()">Loading</a></div> 2.遮罩层: 复
-
Js切换功能的简单方法
我估计很多正在学习css,js的朋友们也有这样的经历,刚在做这个js切换的时候,我想到了一个好的方法,马上给大家分享一下,希望你们能把它拿走 复制代码 代码如下: function changeDiv(index) { for(var i=0;i<=5;i++) { if(i == index) document.getElementById('dv_'+i).className="txt1"; else document.getElementById('dv_'+i).clas
-
用js读写cookie的简单方法(推荐)
在数据安全要求不是很高的情况下,我们可以直接用js对cookie进行读写,这样比较方便. 代码如下: /* 功能:保存cookies函数 参数:name,cookie名字:value,值 */ function SetCookie(name,value){ var Days = 30*12; //cookie 将被保存一年 var exp = new Date(); //获得当前时间 exp.setTime(exp.getTime() + Days*24*60*60*1000); //换成毫秒
-
JS之获取样式的简单实现方法(推荐)
基本代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ color:yellow; } </style> </head> <body> <div style="width:100
-
JavaScript简单实现的仿微博留言功能示例
本文实例讲述了JavaScript简单实现的仿微博留言功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>微博留言</title> </head> <script> window.onload=function(){ var text=docum
-
JS+HTML5 Canvas实现简单的写字板功能示例
本文实例讲述了JS+HTML5 Canvas实现简单的写字板功能.分享给大家供大家参考,具体如下: 先来看运行效果: 具体代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>www.jb51.net JS写字板</title> <script src="http://libs.baidu.com/jquery/2.0.0
-
js+HTML5 canvas 实现简单的加载条(进度条)功能示例
本文实例讲述了js+HTML5 canvas 实现简单的加载条(进度条)功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>www.jb51.net canvas实现加载条动画</title> </head> <body> <canv
-
JS/jQuery实现超简单的Table表格添加,删除行功能示例
本文实例讲述了JS/jQuery实现超简单的Table表格添加,删除行功能.分享给大家供大家参考,具体如下: 最近需要表格添加删除行,添加行简单,删除行就有点儿懵逼了,于是网上找实例,功夫不负有心人,终于让我找到了,下面的是代码,大家觉得可以,记得点赞哦!!!谢谢! 需要的拿去,转载请在明显的位置标注出出处!!! <html> <head> <title>table添加/删除行</title> </head> <body> <t
-
Ajax异步刷新功能及简单案例
目录 GET请求 POST请求 几个一会儿会用到的知识点: 1.xmlhttp.readyState==4 && xmlhttp.status==200 2.针对IE6及以下的版本浏览器的兼容处理 3.onblur事件 操作演示 HTML代码 php代码部分: 1.checkUsername部分: 2.checkEmail部分 3.checkPhone部分 这篇文章主要来介绍一下有关ajax中异步刷新的知识,以及一个简单的注册案例. 我们都知道,异步刷新是ajax中非常重要的一个功能,下面
随机推荐
- vue 实现 tomato timer(蕃茄钟)实例讲解
- 编写自己的jQuery插件简单实现代码
- jquery 删除cookie失效的解决方法
- javascript 单行文字向上跑马灯滚动显示
- 基于HashMap遍历和使用方法(详解)
- PHP 5.0对象模型深度探索之对象复制
- Android离线缓存的实例代码
- BootStrap实现带有增删改查功能的表格(DEMO详解)
- 用php过滤危险html代码的函数
- python套接字流重定向实例汇总
- 让批处理被wsh解析的代码
- Python3访问并下载网页内容的方法
- SQL SERVER备份数据库存储过程的方法
- Apache服务器配置攻略1
- Java中对List去重 Stream去重的解决方法
- Vue 组件修改根实例的数据的方法
- 基于Vue插入视频的2种方法小结
- JavaScript事件委托原理与用法实例分析
- 适配iPhoneXS max和iPhoneX R的方法示例
- volatile与happens-before的关系与内存一致性错误