$ this: eq (2) не работает в плагине

Question

У меня есть структура, похожая на

<div class="wrapper">
    <div class="panel">   </div>
    <div class="panel">   </div>
        :
</div>

Я создал плагин для выравнивания панели друг под другом.Панель, которую я хочу видеть, имеет непрозрачность 1, а остальные непрозрачность 0.

Была создана открытая функция, позволяющая выбрать другую панель с непрозрачностью 1.

Плагин выглядит следующим образом:

(functon($) {
   var someGlobalVars;
   $.fn.panel = function(options} {
      // some logic
      $(this).each(function(index) {
         $(this).css({...});
      )};

   // public function
   $.fn.panel.transition = function(panelNum) {
      $('.wrapper .panel:eq(' + panelNum + ')').css({...}); // <-- works
   };        
});

Плагин называется:

$('wrapper .panel').panel();
$('wrapper .panel').panel.transition(2);

Плагин работает, но мне НУЖНО удалить имена классов из публичной функции, используяУ него.Я пробовал разные способы, такие как:

var $myThis = $(this);
$myThis:eq(' + panelNum + ').css({...});

НО НИЧЕГО, что я пытаюсь, работает.

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

Answer 1

Причина, по которой вы используете + panelNum + в первый раз, в том, что вы объединяете строку.

Итак, это:

$('.wrapper .panel:eq(' + panelNum + ')')

становится:

$('.wrapper .panel:eq( 5 )')  // or whatever the number was

Это только потому, что вы используете String в качестве селектора. Это не делается при вызове функций. Вместо этого вы просто используете имена функций и переменных.

var $myThis = $(this);

$myThis.eq( panelNum ).css({...});

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

Версия строки селектора дает вам немедленный результат, то есть элемент с индексом.

Версия метода принимает набор и сокращает набор до элемента по индексу. Это дает тот же результат, что и версия строки селектора, но требует дополнительного шага сокращения начального набора.

---

РЕДАКТИРОВАТЬ: Я должен отметить, что когда вы делаете $(this), если this представляет один элемент DOM, то не имеет смысла использовать .eq(), поскольку есть только один элемент по индексу 0.

Если this представляет объект jQuery, вам не нужно заключать его в $(). Вы можете просто сделать this.eq( panelNum ).

Answer 2

Попробуйте $myThis.eq(panelNum) или $(this).eq(panelNum) вместо: http://api.jquery.com/eq/

Answer 3

Ни одно из предложений не сработало.Поскольку $ (this) является массивом объектов, я попытался использовать индекс массива, и он работал.

Ниже приведены изменения кода, которые я сделал

(functon($) {
   var someGlobalVars;
   var myThis;                    // <-- added
   $.fn.panel = function(options} {
      // some logic
      myThis = $(this);           // <-- added
      $(this).each(function(index) {
         $(this).css({...});
      )};

   // public function
   $.fn.panel.transition = function(panelNum) {
      // $('.wrapper .panel:eq(' + panelNum + ')').css({...}); // <-- changed
      $(myThis[panelNum]).css({...});                          // <-- to this
   };        
});

Answer 4

$myThis:eq(' + panelNum + ')...

Неверный синтаксис JS ...

Я думаю, вы, вероятно, пытаетесь достичь чего-то подобного:

$myThis.filter(':eq(' + panelNum + ')')...

или

$myThis.eq(panelNum)...