/**
* Created by yu on 2016/11/20 0020.
*/
// 1.禁用页面右键菜单
$(function () {
$(document).on('contextmenu', function (e) {
return false;
});
});
// 2.在新窗口打开页面
$(function () {
// 针对 href=http的超链接
$('a[href^="http://"]').attr('target', '_blank');
// 针对rel=external的超链接
$('a[rel$="external"]').click(function () {
this.target = '_blank';
});
});
// 3.输入框文字获取和失去焦点
$(function () {
$('.text1').val('输入你要搜索的文字');
textFill($('input.text1'));
function textFill(input) {
var originalValue = input.val();
input.focus(function () {
if (input.val() === originalValue) {
input.val('');
}
}).blur(function () {
if (input.val() === '') {
input.val(originalValue);
}
});
}
});
// 4.返回顶部
$('#goheader').click(function () {
$('html,body').animate({scrollTop: 0}, 600);
return false;
});
// 5.获取鼠标位置
$(function () {
$(document).mousemove(function (e) {
$('#xy').html('X:' + e.pageX + '| Y:' + e.pageY);
});
});
// 6.判断元素是否存在
$(function () {
if ($('#id').length) {
window.alert('id 元素存在');
}
});
// 7.点击div也可以跳转
$('div').click(function () {
window.location = $(this).find('a').attr('href');// window.location可以简单理解为浏览器访问的地址
return false;
});
// 8.根据浏览器大小添加不同的样式
$(document).ready(function () {
function checkWindowSize() {
if ($(window).width() > 1200) {
$('body').addClass('large');
} else {
$('body').removeClass('large');
}
}
$(window).resize(checkWindowSize);// 当浏览器大小改变时再次出发checkWindowsSize
});
// 9.设置div在屏幕中央
$(function () {
jQuery.fn.center = function () {
this.css('position', 'absolute');
this.css('top', ($(window).height() - this.height()) / 2 + $(window).scrollTop() + 'px');// 使用scrollTop来获取元素相对于顶部的偏移量
this.css('left', ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + 'px');
return this;
};
$('#xy').center();
});
// 10.关闭所有动画效果
$(function () {
$.fx.off = true;
});
// 11.检测鼠标右键和左键
$(function () {
$('#xy').mousedown(function (e) {
window.alert(e.which);// 1为左键,2为中键,3为右键
});
});
// 12.回车提交表单
$(function () {
$('input').keyup(function (e) {
if (e.which === '13') { // 回车键为13
window.alert('回车提交');
}
});
});
// 13.设置全局Ajax参数
$('#load').ajaxStart(function () {
showLoading();// 显示loading
disableButton();// 禁用按钮
});
$('#load').ajaxComplete(function () {
hideLoading();// 隐藏loading
enableButtons();// 启用按钮
});
// 14.获取选中的下拉框
$(function () {
$('#mySelect').find('option:selected');
$('#mySelect option.selected');
});
// 15.切换复选框
$(function () {
var tog = false;
$('toggleButton').click(function () {
$('input[type=checkbox]').attr('checked', !tog);
tog = !tog;
});
});
// 16.使用siblings()来选择同辈元素
$('nav li').click(function () {
$(this).addClass('active')
.siblings().removeClass('active');
});
// 17.个性化链接,为不同的文件下载链接添加不同样式
$(function () {
$("a[href$='zip']").addClass('zip');
$("a[href$='pdf']").addClass('pdf');
$("a[href$='psd']").addClass('psd');
});
// 18.在一段时间之后自动隐藏或关闭元素
$(function () {
setTimeout(function () {
$('#tempElement').fadeOut(600);// 600毫秒的动画
}, 3000);// 3000毫秒后自动隐藏
$('#tempElement').slideDown(300).delay(3000).fadeOut(600);// 也可以使用delay()来实现啊
});
// 19.为任何与选择器相匹配的元素绑定事件
// 为table中的td绑定click事件
$(function () {
$('table').on('click', 'td', function () {
$(this).toggleClass('hover');
});
});