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

Question

[PlatinumArcade]

Сделал простенький плагин, обертывающий текстовый 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>

Answer 1

[winbackgo]

Ну так и сделайте дополнительную fn и используйте так.

$.fn.onEnterPress = function(fn) {
	this.each(function() {
			$(this).bind('onEnterPress', fn)
		}
	);
        return this
};

Только мне не совсем понятно какие цели преследуются.

Comments

[PlatinumArcade]

Через bind не так интуитивно получается… Спасибо за примеры!

Answer 2

[Виктор Кузнецов]

Примерно так можно:

(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');
});

Answer 3

[Mithgol]

Решение ужé нашли Вам, но можно заметить, что оно не в стиле jQuery, равно как и сама поставленная Вами задача.

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

Следовало бы поэтому и Ваш метод назвать не «onEnterPress», а попросту «enter».

Answer 4

[spmbt]

jQuery.fn.onEnterPress = function(F){
$(this).bind('onEnterPress', F);
return this;
}
www.sitepoint.com/how-to-develop-a-jquery-plugin/