js里面没有直接的右击事件,可采用onmousedown事件进行判断实现。如下:
document.getElementById("test").onmousedown = function(e){if(e.button ==2){
//alert("你点了右键")
//这样设计你的颜色样式...
}else if(e.button ==0){
alert("你点了左键")
}else if(e.button ==1){
alert("你点了滚轮")
}
}
2、数据的过滤方法有很多,javaScript 、jQuery里面的filter函数,鉴于本题,最好采用angularJs实现。总体 参考代码如下:
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js">
</script>
<script type="text/javascript">
window.onload = function(){
//去掉默认的contextmenu事件,否则会和右键事件同时出现。
document.oncontextmenu = function(e){
e.preventDefault()
}
document.getElementById("test").onmousedown = function(e){
if(e.button ==2){
alert("你点了右键")
//这样设计你的颜色样式...
}else if(e.button ==0){
alert("你点了左键")
}else if(e.button ==1){
alert("你点了滚轮")
}
}
}
</script>
</head>
<body>
<div ng-app="myApp" ng-controller="namesCtrl">
<p>输入过滤:</p>
<p><input type="text" ng-model="test"></p>
<ul>
<li ng-repeat="x in names | filter:test | orderBy:'pin'">
{{ (x.name | uppercase) + ', ' + x.pin }}
</li>
</ul>
</div>
<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
$scope.names = [
{name:'张三',pin:'zhang san'},
{name:'王斌',pin:'wang bin'},
{name:'张春桥',pin:'zhang chun qiao'},
{name:'王滨',pin:'wang bin'}
]
})
</script>
<div style="width: 600pxheight:50pxmargin:autoborder:1px solid pink" id="test">
<p>朝鲜新建农场</p>
</div>
</body>
</html>
//把你的js代码替换成这个$('#three_liest li').bind("click",function(){
$(this).addClass("active").siblings().removeClass("active")
})
<style type="text/css">.add{ color:#ff0}
</style>
<div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<script type="text/javascript" src="http://www.sz886.com/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div ul li").click(function(){
$(this).addClass("add").siblings().removeClass("add")
})
})
</script>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)