先新建一個js，名為jquery.lifocuscolor.js，編寫一下代碼：

(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);

界面中引入jquery.lifocuscolor.js然后調用函數focusColor，就可以實現聚焦變換顏色了

<script type="text/javascript" src="Plugin/jquery.lifocuscolor.js"></script>

<script type="text/javascript">
$(function() {
$("#u1").focusColor("red");//調用自定義的插件
})
</script>

?

轉載于:https://www.cnblogs.com/soccer/p/3522722.html

總結

以上是生活随笔為你收集整理的一个经典的对象级别插件的开发的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。