<!doctype html >
<html style="font-size:13.5px;">
<head>
<meta charset="utf-8">
<title>JS 绑定 事件</title>
</head>
<style type="text/css">
li{ width:500px; line-height:20px;}
</style>
<body>
<ul>
<li>111111111</li>
<li>222222222</li>
<li>3333333333</li>
</ul>
<div id="btn"> 点击</div>
</body>
</html>
<script src="jquery.1.9.0.min.js"></script>
<script type="text/javascript">
$(function(){
oEditor.init();
});
var oEditor={
//当前dom
currentObj:{},
};
oEditor.init=function(){
$("li").click(function(e){
var target = $(e.target);
oEditor.currentObj=target; //当前DOM
alert(oEditor.currentObj.html())
})
}
</script>
//上面是点击找到当前的 元素。
//下面是 指定 当前元素 其中 主要的句
e.target 返回触发此事件的元素（事件的目标节点）。
var target = $(e.target); oEditor.currentObj=target;
<!doctype html >
<html style="font-size:13.5px;">
<head>
<meta charset="utf-8">
<title>JS 绑定 事件</title>
</head>
<style type="text/css">
li{ width:500px; line-height:20px;}
.select{ background:#ccc;}
</style>
<body>
<ul>
<li>111111111</li>
<li>222222222</li>
<li>3333333333</li>
</ul>
<div id="btn"> 点击</div>
</body>
</html>
<script src="jquery.1.9.0.min.js"></script>
<script type="text/javascript">
$(function(){
oEditor.init();
});
var oEditor={
//当前dom
currentObj:{},
clear:function(){
$("li").each(function(index, element) {
$(this).removeClass("select");
});
}
};
oEditor.init=function(){
$("li").click(function(e){
var target = $(e.target);
oEditor.currentObj=target;
oEditor.clear();
oEditor.currentObj.addClass("select");
});
$("#btn").click(function(){
alert(oEditor.currentObj.html());
})
}
</script>
时间： 2024-11-05 18:58:39