Jquery 学习笔记

//取得页面元素属性值；
$(function(){
        $("#ul_gradePhase li").each(function(i){
            $(this).bind("click",function(){
                var gradePhase=$(this).find("a").attr("data-value");
                var workType=$("#div_workType").find("a[class=curr]").attr("data-value");
                LoadWorkIndex(gradePhase,workType);
            });
        });
//将相对路径转换为绝对路径；
<link href="@Url.Content("http://style.ciwong.net/learnmonth/css/backmain.css")" type="text/css" rel="Stylesheet" />
    <script src="@Url.Content("http://style.ciwong.net/js/jquery-1.7.1.min.js")" type="text/javascript"></script>

保留事件的删除节点
$('div').detach();

//通过 event.type 属性获取触发事件名
$('input').click(function (e) {
alert(e.type);
});

//通过 event.target 获取绑定的 DOM 元素
$('input').click(function (e) {
alert(e.target);
});

//通过 event.data 获取额外数据，可以是数字、字符串、数组、对象
$('input').bind('click', 123, function () { //传递 data 数据
alert(e.data); //获取数字数据
});

注意：如果字符串就传递：'123'、如果是数组就传递：[123,'abc']，如果是对象就传递：
{user : 'Lee', age : 100}。数组的调用方式是：e.data[1]，对象的调用方式是：e.data.user。
//event.data 获取额外数据，对于封装的简写事件也可以使用
$('input').click({user : 'Lee', age : 100},function (e) {
alert(e.data.user);
});

注意：键值对的键可以加上引号，也可以不加；在调用的时候也可以使用数组的方式：
alert(e.data['user']);
//获取移入到 div 之前的那个 DOM 元素
$('div').mouseover(function (e) {
alert(e.relatedTarget);
});

//获取移出 div 之后到达最近的那个 DOM 元素
$('div').mouseout(function (e) {
alert(e.relatedTarget);
});

//获取绑定的那个 DOM 元素，相当于 this，区别与 event.target
$('div').click(function (e) {
alert(e.currentTarget);
});
注意：event.target 得到的是触发元素的 DOM，event.currentTarget 得到的是监听元素的
DOM。而 this 也是得到监听元素的 DOM。
//获取上一次事件的返回值
$('div').click(function (e) {
return '123';
});

$('div').click(function (e) {
alert(e.result);
});
//获取当前的时间戳
$('div').click(function (e) {
alert(e.timeStamp);
});

//获取鼠标的左中右键
$('div').mousedown(function (e) {
alert(e.which);
});
//获取键盘的按键
$('input').keyup(function (e) {
alert(e.which);
});
//获取是否按下了 ctrl 键，meta 键不存在，导致无法使用
$('input').click(function (e) {
alert(e.ctrlKey);
});
//获取触发元素鼠标当前的位置
$(document).click(function (e) {
alert(e.screenY+ ',' + e.pageY + ',' + e.clientY);
});

jQuery 提供了一个事件对象的方法：event.stopPropagation()；这个方法设置到需要触发
的事件上时，所有上层的冒泡行为都将被取消。
$('input').click(function (e) {
alert('按钮被触发了！');
e.stopPropagation();
});
网页中的元素，在操作的时候会有自己的默认行为。比如：右击文本框输入区域，会弹
出系统菜单、点击超链接会跳转到指定页面、点击提交按钮会提交数据。
$('a').click(function (e) {
e.preventDefault();
});

控制换行，避免英文折断
"word-wrap: break-word; word-break: normal

Jquery 学习笔记

相关推荐