課程
/前端開發
/jQuery
/jQuery基礎(五)一Ajax應用與常用插件
為什么需要在其<ul>父元素上調用,而不是在<li>上調用
2017-07-19
源自:jQuery基礎(五)一Ajax應用與常用插件 2-8
正在回答
回答問題之前,先看下插件的代碼:
/*------------------------------------------------------------/ 功能:設置列表中表項獲取鼠標焦點時的背景色 參數:li_col【可選】?鼠標所在表項行的背景色 返回:原調用對象 示例:$("ul").focusColor("red"); /------------------------------------------------------------*/ ;?(function($)?{ ????$.fn.extend({ ????????"focusColor":?function(li_col)?{ ????????????var?def_col?=?"#ccc";?//默認獲取焦點的色值 ????????????var?lst_col?=?"#fff";?//默認丟失焦點的色值 ????????????//如果設置的顏色不為空,使用設置的顏色,否則為默認色 ????????????li_col?=?(li_col?==?undefined)???def_col?:?li_col; ????????????$(this).find("li").each(function()?{?//遍歷表項<li>中的全部元素 ????????????????$(this).mouseover(function()?{?//獲取鼠標焦點事件 ????????????????????$(this).css("background-color",?li_col);?//使用設置的顏色 ????????????????}).mouseout(function()?{?//鼠標焦點移出事件 ????????????????????$(this).css("background-color",?"#fff");?//恢復原來的顏色 ????????????????}) ????????????}) ????????????return?$(this);?//返回jQuery對象,保持鏈式操作 ????????} ????}); })(jQuery);
由此可見:遍歷表項的時候是利用$('ul').find('li').each()方法來的。
所以只需要獲得ul,就可以利用事件轉移快速高效給所有ul>li都加上這個效果!
舉報
如何用jquery實現ajax應用,加入學習,有效提高前端開發速度
4 回答作為<li>元素的”保存“”退出“怎么不顯示在頁面上,而是通過右鍵才能顯示?
3 回答調用不了php文件怎么辦
2 回答為什么要加html,作用是什么?
1 回答上一節的get()后要加上一個json,為什么post不加php呢
1 回答沒有加載到li元素,圖片也同樣是加載失敗
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2017-07-20
回答問題之前,先看下插件的代碼:
/*------------------------------------------------------------/ 功能:設置列表中表項獲取鼠標焦點時的背景色 參數:li_col【可選】?鼠標所在表項行的背景色 返回:原調用對象 示例:$("ul").focusColor("red"); /------------------------------------------------------------*/ ;?(function($)?{ ????$.fn.extend({ ????????"focusColor":?function(li_col)?{ ????????????var?def_col?=?"#ccc";?//默認獲取焦點的色值 ????????????var?lst_col?=?"#fff";?//默認丟失焦點的色值 ????????????//如果設置的顏色不為空,使用設置的顏色,否則為默認色 ????????????li_col?=?(li_col?==?undefined)???def_col?:?li_col; ????????????$(this).find("li").each(function()?{?//遍歷表項<li>中的全部元素 ????????????????$(this).mouseover(function()?{?//獲取鼠標焦點事件 ????????????????????$(this).css("background-color",?li_col);?//使用設置的顏色 ????????????????}).mouseout(function()?{?//鼠標焦點移出事件 ????????????????????$(this).css("background-color",?"#fff");?//恢復原來的顏色 ????????????????}) ????????????}) ????????????return?$(this);?//返回jQuery對象,保持鏈式操作 ????????} ????}); })(jQuery);由此可見:遍歷表項的時候是利用$('ul').find('li').each()方法來的。
所以只需要獲得ul,就可以利用事件轉移快速高效給所有ul>li都加上這個效果!