我想写一个可重用的函数 [英] i want to write a reusable function

问题描述

我是网站设计的本科生初学者.我现在正在学习jQuery，我想知道我该如何编写一个函数以供其他元素重用 这是针对1个元素的workind函数，我想单独应用于其他函数.

i'm undergraduate student beginner in web designing. am learning jquery now and i want to know how can i write a function to reuse for others elements here is the function which is workind for 1 element and that i want to apply to others individually.

$(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代码

Here is the html code that i want to duplicate into 4 columns

    <div class="small-3 large-3 column table" id="table-one">
    <div class="box" id="one">
        <h5>Basic</h5>
    </div>
    <div class="box" id="two">
        <h3>$199<br /><span>per month</span></h3>
    </div>
    <div class="box" id="three">
        <p><strong>10</strong> projects</p>
    </div>
    <div class="box" id="four">
        <p><strong>5GB</strong> Storage</p>
    </div>
    <div class="box" id="five">
        <p><strong>Free</strong> Live Support</p>
    </div>
    <div class="box" id="six">
        <p><strong>2 years</strong> licence</p>
    </div>
    <div class="box" id="seven">
        <p><strong>Basic</strong> Customization</p>
    </div>
    <div class="box" id="eight">
        <a href="#"><button class="sign-up" id="basic">SIGN UP</button></a>
    </div>
</div>

推荐答案

自从我使用jQuery以来已经很久了，不管怎样尝试: .hover()

It's been so long since I worked with jQuery, anyway try this : http://jsbin.com/izaxeb/

Refer : .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知识

OP : Welcome to stackoverflow .. feel free to explore the knowledge @stackoverflow

这篇关于我想写一个可重用的函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！