JQuery: как сделать свое событие не через bind?

Сделал простенький плагин, обертывающий текстовый input лейблом и при нажатии Enter, должно срабатывать событие onEnterPress:



(function($){<br>
	var defaults = {};<br>
	$.fn.textWrap = function(params) {<br>
		var options = $.extend({}, defaults, params);<br>
		return this.each(function() {<br>
			$(this).wrap('<label class="tWrap"></label>').keypress(function(e) {<br>
				code = (e.keyCode ? e.keyCode : e.which);<br>
				if (code == 13) $(this).trigger('onEnterPress');<br>
			});<br>
		});<br>
	};<br>
})(jQuery);<br>
<br>
// Применяем плагин, обертывание срабатывает<br>
$('#inputText').textWrap();<br>


Теперь хочу к объектам, к которым применен плагин, примастырить событие onEnterPress, которое можно будет вызвать так:



$('#inputText').onEnterPress(function() {<br>
	// Не работает, выдает ошибку Object [object Object] has no method onEnterPress<br>
	alert('ENTER PRESSED');<br>
});<br>


а не через bind:



$('#inputText').bind('onEnterPress', function() {<br>
	// Это успешно срабатывает<br>
	alert('ENTER PRESSED');<br>
});<br>
  • Вопрос задан
  • 4147 просмотров
Решения вопроса 1
winbackgo
@winbackgo
Ну так и сделайте дополнительную fn и используйте так.
$.fn.onEnterPress = function(fn) {
	this.each(function() {
			$(this).bind('onEnterPress', fn)
		}
	);
        return this
};

Только мне не совсем понятно какие цели преследуются.
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
@janitor
Веб-разаботчик
Примерно так можно:

(function($){
    $.fn.onEnterPress = function (callback) {
        return this.each(function() {
            $(this).on('keypress', function(e) {
                var code = e.keyCode || e.which;
                if (code == 13 && typeof callback == 'function') {
                    e.preventDefault();
                    callback();
                }
            });
        });
    };
})(jQuery);

$('input[name="email"]').onEnterPress(function() {
    alert('hello');
});
Ответ написан
Комментировать
Mithgol
@Mithgol
Решение ужé нашли Вам, но можно заметить, что оно не в стиле jQuery, равно как и сама поставленная Вами задача.

В jQuery почти все методы обработки событий называются простыми глаголами: .blur(), .change(), .click(), .error(), .focus(), .hover(), .load(), .ready(), .resize(), .scroll(), submit() и так далее.

Следовало бы поэтому и Ваш метод назвать не «onEnterPress», а попросту «enter».
Ответ написан
Комментировать
spmbt
@spmbt
jQuery.fn.onEnterPress = function(F){
$(this).bind('onEnterPress', F);
return this;
}
www.sitepoint.com/how-to-develop-a-jquery-plugin/
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы