幫忙解釋一下
<!DOCTYPE html>
<html>
<head>
? ? <script type="text/javascript" src="http://idcbgp.cn/data/jquery-1.8.2.min.js"></script> ? ? ? ?
</head>
<body>
? ? <div id="content">
? ? ? ? <ul>
? ? ? ? ? ? <li>語文</li>
? ? ? ? ? ? <li>數(shù)學(xué)</li>
? ? ? ? ? ? <li>英語</li>
? ? ? ? ? ? <li>物理</li>
? ? ? ? ? ? <li>化學(xué)</li>
? ? ? ? ? ? <li>生物</li>
? ? ? ? </ul>
? ? </div>
? ? <script type="text/javascript">
? ? ? ?(function($){
? ? ? ? ? $.extend({
? ? ? ? ? ? ? "liFocus":function(myli){
? ? ? ? ? ? ? ? ? myli.css("background-color","#ccc");
? ? ? ? ? ? ? }, ? ? ? ? ? ? ?
? ? ? ? ? ? ? "liBlur":function(myli){
? ? ? ? ? ? ? ? ? myli.css("background-color","#fff");
? ? ? ? ? ? ? }
? ? ? ? ? }); ? ?
? ? ? ?})(jQuery);
? ? ? ?
? ? ? ?$(function(){
? ? ? ? ? ?$("li").bind("mouseover",function(){
? ? ? ? ? ? ? ?$.liFocus($(this));
? ? ? ? ? ?});
? ? ? ? ? ?$("li").bind("mouseout",function(){
? ? ? ? ? ? ? ?$.liBlur($(this));
? ? ? ? ? ?});
? ? ? ?});
? ? </script>
</body>
</html>
看了下別人的代碼 , 自己參照這也做了下 ,主要還是不理解?
例如:
?? ?$("li").bind("mouseout",function(){
? ? ? ? ? ? ? ?$.liBlur($(this));
搞不懂用this為什么就可以做到對每個li元素單獨改變背景顏色的?為啥我做的都是整個li一起顏色變換?
2016-04-26
$.liBlur($("li"));你這里$("li")選擇的是所有的li當然全部變顏色了,人家的代碼使用的$(this),意思是觸發(fā)了這個事件的li,而并不是所有的li,this這個東西你可以去百度看看,大致了解一下就能看懂了。
2016-04-15
你做的是怎么樣的,他這個是合成事件,就是mouseover和mouseout放在一起了!- -
$(function(){
? ? ? ? ? ?$("li").bind("mouseover",function(){
? ? ? ? ? ? ? ?$.liFocus($(this));
? ? ? ? ? ?});
? ? ? ? ? ?$("li").bind("mouseout",function(){
? ? ? ? ? ? ? ?$.liBlur($(this));
? ? ? ? ? ?});
? ? ? ?});