1.无刷新评论

tips：

appendChild：将新元素作为父元素的最后一个子元素进行添加。

insertBefore：在一个指定的子节点之前插入一个节点

实现：

<!DOCTYPE html>

<html>

<head>

<title></title>

<style type="text/css">

#txt{

　　　　　　width:400px;

　　　　　　height:300px;

　　　　     }

</style>

<script type = "text/javascript">

　　onload = function() {

var btn = document.getElementById("btn");

btn.onclick = function()       {

　var p = document.createElement("p");

var txt = document.getElementById("txt").value;

p.appendChild(document.createTextNode(txt));

var ps = document.getElementById("dv").getElementsByTagName("p");

　　　//判断是否已经存在评价

　　　　//当评价存在，则将新评论插入到最前

  if(ps.length > 0) {

          document.getElementById("dv").insertBefore(p,ps[0]); //使用insertBefore将新的评论添加到p标签下第一个元素

        　　}

　　　　//如果评论不存在使用appendChild的方法添加评论到p标签下     

　　　　else {

          document.getElementById("dv").appendChild(p);

          　　　　}

　　 }

}

</script>

</head>

<body>

<textarea id="txt"></textarea>

<br/>

<input type="button" id = "btn" value="评论"/>

<br/>

<div id="dv">

</div>

</body>

</html>

2.IE下剪切板的访问

tips：

window.clipboardData.setData("text",文本)："text"为固定属性。添加文本数据到剪切板。

window.clipboardData.getData("text")："text"为固定属性。获取剪切板中的数据。

window.location：对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面

实现：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>禁止复制</title>

　　<script type="text/javascript">

　　　　onload = function () {

//仅仅支持IE浏览器

　　　　　　var btn = document.getElementById("btn");

　　　　　　var bpase = document.getElementById("btncopy");

　　　　　　var txt = document.getElementById("txt");

　　　　　　btn.onclick = function () {

　　　　　　var h = location.href;

　　　　　　window.clipboardData.setData("text",h);

}

bpase.onclick = function () {

var ptxt = window.clipboardData.getData("text");

　　　　　txt.value = ptxt;

　　　　}

}

</script>

</head>

<body>

　　  <textarea id="txt" style="height:200px;width:400px;">

</textarea>

　　  <input type="button" id="btn" value="点击复制当前网页地址" />

<input type="button"  id="btncopy" value="粘贴入文本框" />

</body>

</html>

JavaScript实现无刷新评论及在IE下的剪切板访问（学习）的更多相关文章

  1. ajax+FormData+javascript实现无刷新表单信息提交

    ajax+FormData+javascript实现无刷新表单信息提交 原理: dom收集表单信息,利用FormData快速收集表单信息  ,实例化表单数据对象 同时收集fm的表单域信息. var f ...

  2. ajax+FormData+javascript 实现无刷新上传附件

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. ajax+FormData+javascript 实现无刷新表单注册

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. PHP Ajax JavaScript 实现 无刷新附件上传

    普通表单 前端页面 后台处理 带有文件的表单 刷新方式 前端界面 后台页面 无刷新方式 大文件上传 POST极值 upload极值 上传细节 前端页面 后台处理 总结 对一个网站而言,有一个基本的不可 ...

  5. HTML5 完美解决javascript中iphone手机和android手机复制文本到剪切板问题

    1.执行以下解决方案条件:(这个是原理) ①执行复制方法时 所复制文字不能被任何 块级元素和行内块元素和行内元素遮盖否则无效:(解决方案:将文本通过绝对定位或其他方式移除屏幕外) ②ios中不能复制属 ...

  6. [Asp.net mvc]jquery.form.js无刷新上传

    写在前面 最近在自己的网盘项目中想用ajax.beginform的方式做无刷新的操作,提交表单什么的都可以,但针对文件上传,就是个鸡肋.在网上查找了发现很多人都遇到了这个问题,大部分都推荐使用jque ...

  7. 自己动手用Javascript写一个无刷新分页控件

    .NET技术交流群:337901356 ,欢迎您的加入! 对 于一个用户体验好的网站来说,无刷新技术是很重要的,无刷新,顾名思义,就是局部刷新数据,有用过Asp.net Web Form技术开发网页的 ...

  8. PHP + JavaScript + Ajax 实现无刷新页面加载效果

    数据源工厂 Json生成方式1 Json生成方式2 数据搬运工 数据加工师 转换类型 加工展示 结果展示 初始页面 点击按钮之后 总结 今天这个实验的思路就是实现一个无刷新的页面加载效果.具体的思路是 ...

  9. javascript项目实战---ajax实现无刷新分页

    分页: limit 偏移量,长度; limit 0,7; 第一页 limit 7,7; 第二页 limit 14,7; 第三页 每页信息条数:7 信息总条数:select count(*) from ...

随机推荐

  1. CPP-基础：互斥量

    互斥量的用途和临界区很像.它与临界区的差别在于可以跨线程使用,可以用来同步进行多个线程间的数据访问,但是是以牺牲速度为代价的.只有临界区是非核心对象,那么互斥量就是一个核心对象了.核心对象的特点是有所 ...

  2. 设计模式——责任链（chain of responsibiltiy）

    责任链模式在面向对象程式设计里是一种软件设计模式,它包含了一些命令对象和一系列的处理对象. 每一个处理对象决定它能处理哪些命令对象,它也知道如何将它不能处理的命令对象传递给该链中的下一个处理对象.也就 ...

  3. java两种反射的区别 - Class.forName()和ClassLoader.loadClass()

    在理解这两种反射机制之前,需要弄清楚java类的加载机制. 装载:通过类的全限定名获取二进制字节流(二进制的class文件),将二进制字节流转换成方法区中的运行时数据结构,在内存中生成Java.lan ...

  4. 图片左右滚动控件（带倒影）——重写Gallery

    转http://blog.csdn.net/ryantang03/article/details/8053643 今天在网上找了些资料,做了一个图片左右滚动的Demo,类似幻灯片播放,同时,图片带倒影 ...

  5. AOP切点切面内容

    一.实现接口MethodBeforeAdvice该拦截器会在调用方法前执行             实现接口   AfterReturningAdvice该拦截器会在调用方法后执行          ...

  6. 在js中获取request域中的内容

    1.可以使用小脚本<%%>实现: var pro_id=<%request.getPro_id()%>; 2.使用隐藏域实现: <input type="hid ...

  7. mysql 修改数据类型

    只修改列的数据类型的方法: 通常可以写成 alter table 表名 modify column 列名 新的列的类型 例如:student表中列sname的类型是char(20),现在要修改为var ...

  8. Office365学习笔记—创建WikiPage

    1,项目有个需求:项目表每更新一次,就把跟该项目有关的任务创建一个静态页(历史版本功能)! 注意事项:需要在页面上拖一个ContentEditer!将代码放在ContentEditer里面,因为我试过 ...

  9. Swift_错误处理

    Swift_错误处理 点击查看源码 //错误处理 func test() { //错误枚举 需ErrorType协议 enum ErrorEnum: Error { case `default` // ...

  10. java8的新特性，Collections.sort(排序的List集合)的使用，对list封装Map里面的某个值进行排序

    --------------------------对简单list的排序---------------------------------- List<Integer> list = ne ...