我想写一个可重用的函数

我是网络设计的本科生初学者。 我现在正在学习jquery，我想知道如何编写一个函数来重用其他元素这里的函数是1个元素的workind，我想单独地应用于其他元素。

$(function(){ $('#basic').mouseover(function(){ $('#table-one').css({ boxShadow : "0 0 5px 3px rgba(100,100,200,0.4)" }); }); $('#basic').mouseout(function(){ $('#table-one').css({ boxShadow : "0 0 0 0" }); }); }); 

这是我要复制到4列的html代码

  
 
 
Basic
 
 
 
$199
per month
 
 
 
10 projects
 
 
 
5GB Storage
 
 
 
Free Live Support
 
 
 
2 years licence
 
 
 
Basic Customization
 
 
 SIGN UP 
  

Answer 1

我想你想要这样的东西

 $(function() { applyHoverStyles('#basic', '#table-one', { boxShadow : "0 0 5px 3px rgba(100,100,200,0.4)" }, { boxShadow : "0 0 0 0" }); }); function applyHoverStyles(triggerSelector, targetSelector, mouseOverStyle, mouseOutStyle) { $(triggerSelector).mouseover(function() { $(targetSelector).css(mouseOverStyle); }); $(triggerSelector).mouseout(function() { $(targetSelector).css(mouseOutStyle); }); } 

Answer 2

自从我使用jQuery已经很久了，无论如何都试试这个： http ： //jsbin.com/izaxeb/

参考： .hover()

 (function ($) { $.fn.inout = function (ele1) { //defining a jQuery plugin //do stuff after calling plugin-function $(this).hover(function () { //on mouseover $(ele1).text("Told you not to touch me"); }, function () { //on mouseout $(ele1).text("Thank U :)"); }); return this; //useful for chaining }; })(jQuery); $(function () { $("#basic").inout("#table1"); //calling "inout" function from the plugin }); 

OP：欢迎来到stackoverflow ..随时探索知识@stackoverflow

Answer 3

为此，您必须使用jquery插件

简单的Jquery插件示例

使用jquery插件，您可以重用代码，

Slideshare插件

  $.fn.PlugInName{}