Имена атрибутов html-элементов jQuery

Question

Меня попросили помочь добавить onChange к выбору, поэтому я придумал это:

$("select[name=component]").change(function() {
  $("input[name=Code]").val(JSONObject[$(this).selectedIndex].code;  
  $("input[name=Category]").val(JSONObject[$(this).selectedIndex].category;  
  $("input[name=UOM]").val(JSONObject[$(this).selectedIndex].uom;  
});

Аскер сказал мне, что это не сработало, пока он не изменился $(this) до this

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

Еслинет, мне просто нужно было бы использовать .attr("selectedIndex")?

Преобразует ли jQuery объект на лету из $(this) (объект jQuery) в элемент формы или объект выбора?

Answer 1

Объект jQuery на самом деле не является расширением элемента DOM: элемент DOM становится дочерним по отношению к элементу jQuery.

Он находится в 0 элементе объекта jQuery, поэтому если для некоторыхпричина, по которой нужно использовать объект jQuery (который как @nickf в контексте этого примера является безумным - вместо этого нужно просто использовать this.selectedIndex), необходимо использовать

$(this)[0].selectedIndex

для доступа к оригиналуатрибут.

Answer 2

Внутри всех обработчиков событий this является самим элементом DOM и не является объектом jQuery.

Здесь нет никакой магии - $(this) просто создает объект jQuery, обернутый вокруг вашего элемента (<select>).У jQuery нет свойства .selectedIndex, но у элемента DOM есть, поэтому нет необходимости вызывать $(this)

Answer 3

$ (this) действительно обернет данный объект в объект JQuery - и так как selectedIndex НЕ является атрибутом элемента html, вы теряете доступ к этому свойству. Таким образом, правильный способ получить доступ к этому свойству - не заключать его в объект jquery - this.selectedIndex.