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>
创建三个类名，三个类名分别给上三个背景颜色，如：.bgColor0{background-color:#158AEA}
.bgColor1{background-color:#996633}
.bgColor2{background-color:#66FF00}
获取012三个随机数前面添加字符串'bgColor'就得到随机的类名，然后给相应的元素添加得到的随机类名就行了。
而要获取012三个随机数就用Math.floor(Math.random()*3)获取。
不过你要求背景色不能重复，那么就把三个类名放进一个数组里。已经使用的类名就用”数组名.shift“把它从数组中d出。然后剩下的两个类名就要获取01两个随机数，就用Math.floor(Math.random()*2)获取0和1其中一个数。
剩下的你知道该怎么做了。
首先你必须知道表达颜色的几种方式1、通过英文单词 如：green
2、通过十六进制 如：#ffffff
3、通过rgb 如：RGB(255,255,255)
如果是通过英文单词的话，可以通过自定义一些颜色英文单词数组，然后从数组中随机取值，然后赋值给标签相关属性就可以了。如果是通过第二种方式的话，可以通过js里面的随机函数Math.random()拼接一个十六进制的数字。同样，在第三种方案也是通过系统随机函数来构造颜色。
至于字体的话，同理。不过只能采用自定义的方案了。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）