这两天在做Web前端时,遇到需求通过js实现文本复制的功能。
先不考虑浏览器的兼容性,看看各浏览器对复制功能的支持情况:

复制代码 代码如下:

从一个表单checkbox获取到已选中的数据值:

1、IE浏览器,解决方法有三种,代码如下:

<script type=”text/javascript” src=”jquery.js”></script>
<body>
<form action=”” method=”post” enctype=”multipart/form-data”>
<label>请选择上传的图片</label>
<a href=”javascript:addimg()” >增加图片</a>
<div class=”mdiv” id=”mdiv”>
<div class=”iptdiv” >
<input type=”file” name=”img[]” class=”ipt” /><a href=”#”
name=”rmlink”>X</a>
</div>
</div>
<input type=”submit” name=”submit” value=”上传图片” />
</form>
<script type=”text/javascript” >
$(document).ready(function(){
bindListener();
});
// 用来绑定事件(使用unbind避免重复绑定)
function bindListener(){
$(“a[name=rmlink]“).unbind().click(function(){
$(this).parent().remove();
})
}
function addimg(){
$(“#mdiv”).append(‘<div class=”iptdiv”><input type=”file”
name=”img[]” class=”ipt” /><a href=”#” name=”rmlink”> X
</a></div>’);
// 为新元素节点添加事件侦听器
bindListener();
}
</script>

复制代码 代码如下:

复制代码 代码如下:

代码如下: script type=”text/javascript”
src=”jquery.js”/script body form action=”” method=”post”
enctype=”multipart/form-data” label请选择上传…

<input type=”checkbox” name=”cb” value=”1″ />aa
<input type=”checkbox” name=”cb” value=”2″ />bb
<input type=”checkbox” name=”cb” value=”3″ />cc
<input type=”checkbox” name=”cb” value=”4″ />dd
<br/>
<input type=”button” value=”提交” onclick=”checkedValues()” />

function copy(txtid){
var txtObj = document.getElementById(txtid);
if(window.clipboardData){ // 仅IE支持此对象,firefox、chrome不支持
//1、通过clipboardData对象实现复制
//window.clipboardData.clearData();
//window.clipboardData.setData(“Text”,txtObj.value);

采用原生JS写法:

//2、通过document对象实现复制:先选择中文本,再执行复制命令
//txtObj.select();
//document.execCommand(“Copy”); //
仅IE支持,Firefox报语法错误,chrome执行结果返回false(不支持)

复制代码 代码如下:

发表评论

电子邮件地址不会被公开。 必填项已用*标注