Как отправить параметр с включенным слушателем?

#jquery #javascript-events

#jquery #jquery-события

Вопрос:

Я не могу отправить параметр с on помощью прослушивателя. Вот мой код:

 $.each(this.elements, function(i,element){
            
        var tagName = $(element).prop('type').toUpperCase();
        
        switch(tagName) {
            case "TEXT" :
            case "TEXTAREA" :
                $(element).on('focus input focusout', that.inputHandler, tagName); //not working
            case "SELECT-ONE" : 
                $(element).on('change focusout', tagName, that.selectHandler); //not working
            case "RADIO"      :
            case "CHECKBOX"   :
                $(element).on('change focusout', tagName, that.changeHandler);
        }
        
    });
  

Пример :

 this.inputHandler = function (e,tagname) {
          console.log(e,tagname); //i am getting error. how to fix this?
        var val =  $(this).val();
        this.errorHandler(val);
    }
  

Кто-нибудь может подсказать мне правильный путь, пожалуйста?

Комментарии:

1. объявить var self = this , чтобы запомнить ссылку на область?

2. вы не определили «это»!

Ответ №1:

Проблема, по-видимому, в том, что имя тега является строкой, в таком случае jQuery будет считать его делегированным обработчиком событий, а не интерпретировать его как данные. так что попробуйте

 $(element).on('change focusout', {tagName:tagName}, that.changeHandler);
  

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

 event.data.tagName
  

Демонстрация: скрипка

Ответ №2:

обработчик
Тип: Функция ( событие EventObject )
Функция, выполняемая при запуске события.

Когда браузер запускает событие или другой JavaScript вызывает метод jQuery .trigger(), jQuery передает обработчику объект события, который он может использовать для анализа и изменения статуса события.

Как показано в документе, вы не можете передавать обработчику самостоятельно определенные данные. Но, поскольку on документ представляет,

.on( events [, selector ] [, data ], handler )

таким образом вы можете передавать самостоятельно определенные данные (официальный пример):

 function myHandler( event ) {
    alert( event.data.foo );
}
$(element).on( "click", { foo : "self-define-data" }, myHandler );
  

В большинстве случаев было бы полезнее прочитать официальный документ.

Комментарии:

1. выглядит так же, как ответ @ArunPJohny мне …. за исключением того, что вы изменили tagName на foo 😉

2. Иногда я думаю, что вопрос «почему» также имеет значение.