Question

我想更改切换功能，以便将链接文本更改为“显示/隐藏”或“展开/折叠”。

经典JS中的函数定义和调用将是：

function myToggle(expandText, collapseText, id,o){
   // expandText: "expand", "show", "display"
   // collapseText: "collapse", "hide"
   // id: the id of the div to toggle
   // o: the object from where the function has been called
}

我会这样称呼它：

<a href="#" onclick="myToggle('Show','Hide', 'myId', this); return false;">Show the div</a>
<div id='myId'>Hi!</div>

它将通过“隐藏”替换“显示”字符串并显示（）div。再次单击将反转回以前的状态。非常简单的东西，这不是问题。

我是jquery的新手，但我已经爱上了它。我知道有一种干净的方法来创造这样的东西，但我不知道如何使用它......

所以问题是：你如何定义和调用这样的函数？什么是最好和最干净的方式（我应该改变jquery的切换，创建我自己的......）？

任何指针或阅读（没有书，我仍然需要今天完成:) :)将不胜感激。你不需要实际编写函数体来接受它。

Answer 1

你可以write your own plugin。

jQuery.fn.myToggle = function( show, hide, id) {
    return this.each( function() {
        var $href = $(this);
        $href.click( function(evt) {
            var text = $href.text();
            if (text.indexOf(show) > -1) {
                $href.html( text.replace(show,hide) );
            }
            else {
                $href.html( text.replace(hide,show) );      
            }
            $("#" + id).toggle();
            evt.preventDefault();


        });

    });
};



 $('#clicky').myToggle( 'show','hide','myId');

“覆盖”jquery的.toggle（）函数的最佳方法是什么？

1 个答案: