0

関数のデフォルト値を作成しましたが、引数を渡して変更したい場合、値が変更されませんか?

JsFiddle の例を次に示します。

ここに私のマークアップがあります:

HTML:

<div class='container'>
    <img src='https://encrypted-tbn0.google.com/images?q=tbn:ANd9GcRbQ6aMnp7uA2VHgEOY6oU24DcB-ZvoBF_puGTB6kq4c8DyMJr2'/>
    <img src='http://www.fullscreensavers.com/pics/nature02l.jpg' />
    <img src='http://www.fullscreensavers.com/pics/nature03l.jpg' />
</div>

CSS:

.container{
    position: relative;
    margin: 0 auto;
    width: 200px;
    height: 200px;
    margin-top: 50px;
}

.container img{
    position: absolute;
    top: 0;
    left:0;
    width: 100%;
    height: 100%;
    display: none;
}
​

Javascript:

var InfiniteRotator = {
    init: function(domEle, options) {
        options = {
            itemInterval : 5000,
            fadeTime : 2500,
            currentItem : 0
        };
        //count number of items
        var numberOfItems = $('img', domEle).length;
        //show first item
        $('img', domEle).eq(options.currentItem).fadeIn();
        //loop through the items
        var infiniteLoop = setInterval(function() {
            $('img', domEle).eq(options.currentItem).fadeOut(options.fadeTime);
            if (options.currentItem == numberOfItems - 1) {
                options.currentItem = 0;
            } else {
                options.currentItem++;
            }
            $('img', domEle).eq(options.currentItem).fadeIn(options.fadeTime);
        }, options.itemInterval);
    }
};

InfiniteRotator.init($(".container"),{currentItem: 1});​
4

3 に答える 3

3
function(…, options) {
    options = {…};

optionsこれで、引数を上書きするだけです。必要なのは、デフォルトのオプション オブジェクトを引数のプロパティで拡張することです。

function(…, customOptions) {
    var defaults = {…};
    var options = $.extend(defaults, customOptions);
    ...

短く、変数の混乱が少ない:

function(…, options) {
    options = $.extend({…}, options);
    ...
于 2012-08-05T20:38:56.110 に答える
2
function(domEle, options) {
    options = $.extend({
        itemInterval : 5000,
        fadeTime : 2500,
        currentItem : 0
    }, options);
}

編集:おっと、遅すぎます。

于 2012-08-05T20:41:52.190 に答える
1
init: function(domEle, options) {
  options = options || {
    itemInterval : 5000,
    fadeTime : 2500,
    currentItem : 0
  };

     

于 2012-08-05T20:38:45.153 に答える