jQuery是我們在WEB開發中使用最多的JS類庫,他可以很方便的幫助我們實現很多絢麗的功能。本文將給大家介紹JQuery的一種小功能,用來禁用文本框的剪切、復制、粘貼功能,完整的頁面代碼如下:
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>JQuery禁用文本框的剪切、復制、粘貼功能演示代碼</title>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<style>
.main {width: 900px;margin: 0 auto;height: 900px;border: 1px solid #ccc;padding: 20px;}
.header{height: 100px;}
.footer{height: 100px;bottom: 0px;}
.heading{color: #FF5B5B;margin: 10px 0;padding: 10px 0;font-family: trebuchet ms;}
</style>
</head>
<body>
<div class="main">
<div class="heading">JQuery禁用文本框的剪切、復制、粘貼功能演示</div>
<div id='dv1'>
<table>
<tr><td>姓名</td><td><input type='text' id='txt_input' /></td></tr>
<tr><td>簡介</td><td> <textarea id='textarea_inp'></textarea></td></tr>
<tr><td>提示:</td><td><div id='div_cnt'>在上面文本框中執行剪切、復制、粘貼試試吧!!</div></td></tr>
</table>
</div>
</div>
<script>
$(document).ready(function() {
$('#txt_input').bind("cut copy paste", function(e) {
alert('Copy Paste is disabled');
e.preventDefault();
});
$('#textarea_inp').bind("cut copy paste", function(e) {
alert('Copy Paste is disabled');
e.preventDefault();
});
$('#div_cnt').bind("cut copy paste", function(e) {
alert('Copy Paste is disabled');
e.preventDefault();
});
});
</script>
</body>
</html>
