Событие остановки JQuery, всплывающее из вызова метода - PullRequest
Новая
       13

Событие остановки JQuery, всплывающее из вызова метода

1 голос
/ 21 сентября 2011

Я пытаюсь разобраться в структуре плагина jquery и написал следующий HTML-код, который формирует начало слайд-шоу: 

<div id="bubble" style="width: 200px; height: 200px; background: #ccc;"></div>
<script type="text/javascript">
jQuery.noConflict();
(function($) {
    $(function() {
        $(document).ready(function() {
            $("#bubble").bubble();
    });
});
})(jQuery);
</script>

Это связано со следующим кодом плагина jquery: 

(function($){
var i = 0;

var methods = {
    mouseup: function(e){
        $(this).bubble('next');
        e.stopPropagation();
    },
    mousedown: function(e){
        $(this).bubble('next');
        e.stopPropagation();
    },
    next: function(){
        console.log(i++);
    }
};

$.fn.bubble = function(method){
    $(this).bind("mouseup", methods.mouseup)
          .bind("mousedown", methods.mousedown);

    if ( methods[method] ) {
    return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
    } 
};

})(jQuery);

Я не уверен, почему, но нажатие пузырькового поля вызывает несколько итераций следующего метода.Есть ли способ ограничить количество вызовов следующим: метод?

Ответы [ 2 ]

1 голос
/ 21 сентября 2011

Вы привязываете mousedown и mouseup к функции next, это будет отправлять две next функции за клик, я не думаю, что вы собираетесь это сделать.

Чтобы исправить это, удалите одну из привязок или просто привязайте click.

0 голосов
/ 21 сентября 2011

Может быть, вам следует использовать stopImmediatePropagation () , чтобы вы просто регистрировались дважды (потому что дважды вызываете next ()): 

(function($){
var i = 0;

var methods = {
    mouseup: function(e){
        $(this).bubble('next');
        e.stopImmediatePropagation();
    },
    mousedown: function(e){
        $(this).bubble('next');
        e.stopImmediatePropagation();
    },
    next: function(){
        console.log(i++);
    }
};

$.fn.bubble = function(method){
    $(this).bind("mouseup", methods.mouseup)
          .bind("mousedown", methods.mousedown);

    if ( methods[method] ) {
    return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
    }
};

})(jQuery);

fiddle: http://jsfiddle.net/k3FhM/

...