обработчик событий внутри плагина на Jquery

186
04 января 2019, 18:40

Уперся, как мне кажется, достаточно в простую задачу. Но решить сам не могу. Хочу реализовать плагин, заменяющий стандартный вид формы. Сложность в том, что не могу реализовать фокус на div, обертывающий форму, когда срабатывает фокус на самой форме.

Код фрмы

<input type="text" id="input_01">

Вызываю плагин

$('#input_01').awFormLogin
({
    'width' :       150,
    'classblock' :  'aw-frm-bd-fs-restrain aw-frm-so-fs-restrain',
    'classinput' :  ''
});

Код самого плагина

(function($)
{
    $.fn.awFormLogin = function(options)
    { 
        var settings =
        {
          'width' : 100, // ширина 
          'classblock' : '',
          'classinput': ''
        };
        return this.each(function()
        {    
            if (options)
            {
                $.extend(settings, options);
            // Определяем id изменяемого элемента
            var idElement = $(this).attr('id');
            console.log(idElement);
            // Размер поля INPUT
            var widthInput = Math.round(options.width - 62);
            // Выводим новый вид формы
            $(this).replaceWith('<div tabindex="0" class="aw-frm-default-wrapp ' + options.classblock +'" style="width: ' + options.width +'px;"><div class="aw-frm-btn-login"></div><div class="aw-frm-input-wrapp"><input type="text" id="' + idElement + '" class="aw-frm-default aw-frm-default-none ' + options.classinput +'" style="width: ' + widthInput +'px;"></div></div>');
            return this;
        });
    };
})( jQuery );

Если на странице с формой разместить код:

$('input').focus(function()
{
    if($(this).parent().parent().attr('tabindex', 0))
    {
        $(this).parent().parent().focus();
    }
});

То все заработает как мне нужно. Но как реализовать функцию фокуса внутри плагина? Буду благодарен за помощь.

READ ALSO
Как исправить маленький баг?

Как исправить маленький баг?

Если нажать кнопку 1, в элемент с классомtit_modal_email должен вставится текст "Landing Page Сартовий"

167
paypal api (sandbox) как с ним работать

paypal api (sandbox) как с ним работать

у меня консольное приложение которая 1) должна создавать аккаунты в sandbox 2) можно передавать между аккаунтами деньги узаю paypal sdknet

204
Получить высоту и ширину HTML-элемента из .NET

Получить высоту и ширину HTML-элемента из .NET

HTML-страница (строка или HtmlDocument полученный, например, с помощью HtmlAgilityPack)

196
ViewData.ModelMetadata.Properties

ViewData.ModelMetadata.Properties

В поиске решения - в соседней теме подсказали как верно реализовать задачуРеализовал, работает частично

193