1，禁用頁面的右鍵菜單
$(document).ready(function(){
$(document).bind("contextmenu",function(e){
return false;
});
});
2，輸入框文字輸入和失去焦點
<input type="text" class="text1" />
<script>
$(document).ready(function() {
$("input.text1").val("Enter your search text here.");
textFill( $('input.text1') );
});
function textFill(input){ //input focus text function
var originalvalue = input.val();
input.focus( function(){
if( $.trim(input.val()) == originalvalue ){
input.val('');
}
}).blur( function(){
if( $.trim(input.val()) == '' ){
input.val(originalvalue);
}
});
}
</script>
3.返回頭部以及滑到底部 的 滑動動畫
<script type="text/javascript">
//返回頂部
$(".upToTop").click(function(){
$("html").animate({scrollTop:0
},700);
});
//返回底部
var content_height=document.body.scrollHeight; //獲取頁面高度
$(".downToFooter").click(function(){
$("html").animate({scrollTop:content_height
},700);
});
</script>
4，獲取鼠標位置
<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../../scripts/jquery.js" type="text/javascript"></script>
</head>
<body>
<div id="XY" ></div>
<script>
$(document).ready(function () {
$(document).mousemove(function(e){
$('#XY').html("X : " + e.pageX + " | Y : " + e.pageY);
});
});
</script>
</body>
</html>
5，判斷元素是否存在
<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../../scripts/jquery.js" type="text/javascript"></script>
</head>
<body>
<div id="XY" ></div>
<script>
$(document).ready(function() {
if ($('#XY').length){
alert('元素存在!')
}else{
alert('元素不存在!')
}
});
</script>
</body>
</html>
6，點擊div進行跳轉
<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../../scripts/jquery.js" type="text/javascript"></script>
</head>
<body>
<div style="width:200px;height:40px;background:#eee;cursor:pointer;">
<a href="http://www.cssrain.cn">home</a>
</div>
<script>
$(document).ready(function() {
$("div").click(function(){
window.location=$(this).find("a").attr("href");
return false;
});
});
</script>
</body>
</html>
8，回車提交表單
<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../../scripts/jquery.js" type="text/javascript"></script>
<style>
#XY{
width:40px;
height:100px;
background:#aaa;
}
</style>
</head>
<body>
<input type="input" />
<script>
$(document).ready(function() {
$("input").keyup(function(e){
if(e.which=="13"){
alert("回車提交!")
}
})
});
</script>
</body>
</html>