уникальная проблема jquery click - перестает срабатывать после первого клика на том же элементе - PullRequest
Новая
       23

уникальная проблема jquery click - перестает срабатывать после первого клика на том же элементе

1 голос
/ 23 сентября 2011

У меня довольно уникальная проблема, о которой я не вижу никакой информации ... нигде. Кажется, что событие click разбивается на элемент после первого щелчка (не всегда на втором, кажется, что нет никакой согласованности - кроме того, что первый щелчок всегда срабатывает) - как только событие click перестает работать, требуется два щелчки (не двойной щелчок) для события щелчка для запуска.

Вот некоторые особенности:

при загрузке страницы я анализирую строку JSON для заполнения динамически генерируемых списков X, которые будут использоваться аналогично выпадающему меню. В коде сразу после того, как каждое «выпадающее меню» генерируется и отображается на экране, я применяю .click (function () {...

вот сценарий подозрения переменная «tags» представляет объект, который в основном представляет собой набор раскрывающихся меню. 

 $.each(tags, function(k, v){ 
v.display('div#tags'); 
var selector = '#' + v.getId(); 
if(v.isTabled()){ 
    selector += ' tr.Option td'; 
}else{ 
    selector += ' .Option';
} 

var narrowedProducts = []; 

$(selector).click(function(){ 
    $.each($('div.Select'), function(i,e){ 
        var temp = $(this).children('input').attr('value'); 
        narrowedProducts = Row.narrowProducts(temp.split('-'), narrowedProducts); 
    }); 

    if(narrowedProducts.length === 1){ 
        $('input#THEPRODUCT')
            .attr('name', narrowedProducts[0]) 
            .attr('value', narrowedProducts[0]) 
    }else if(narrowedProducts.length === 0){ 

        $('input#THEPRODUCT') 
            .removeAttr('name') 
            .removeAttr('value') 
    }else{} 

    narrowedProducts = []; return; 
}); 
 });

и HTML-код для выпадающих списков ... 

<div id="tags">
  <input type="input" id="THEPRODUCT" />

  <div class="Select Select-sizechart" id="sizechart">
    <span class="Display">Select a sizechart:</span><input type="hidden" name=
    "sizechart" />

    <table class="Selectable">
      <tbody>
        <tr class="TableHeading">
          <th>Size</th>

          <th>Comparable Size</th>

          <th>Bust</th>

          <th>Hip</th>

          <th>Back Length</th>
        </tr>

        <tr class="Option" rel="L" id="68435-68414-68416-68423">
          <td>L</td>

          <td>16-18</td>

          <td>43"-45"</td>

          <td>45"-47"</td>

          <td>43"</td>
        </tr>

        <tr class="Option" rel="XL" id="68432-68437-68419-68428">
          <td>XL</td>

          <td>20-22</td>

          <td>47"-49"</td>

          <td>49"-51"</td>

          <td>44"</td>
        </tr>

        <tr class="Option" rel="S" id="68433-68420-68425-68431">
          <td>S</td>

          <td>8-10</td>

          <td>36"-37"</td>

          <td>38"-39"</td>

          <td>41"</td>
        </tr>

        <tr class="Option" rel="XS" id="68436-68417-68424-68429">
          <td>XS</td>

          <td>4-6</td>

          <td>34"-35</td>

          <td>36"-37"</td>

          <td>40"</td>
        </tr>

        <tr class="Option" rel="M" id="68415-68418-68421-68427">
          <td>M</td>

          <td>12-14</td>

          <td>38.5"-40.5"</td>

          <td>40.5"-42.5"</td>

          <td>42"</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div class="Select Select-color" id="color">
    <span class="Display">Select a color:</span><input type="hidden" name="color" />

    <div class="Selectable">
      <div class="Option" rel="River" id="68435-68418-68420-68424-68428">
        River
      </div>

      <div class="Option" rel="Smoke" id="68432-68433-68414-68415-68417">
        Smoke
      </div>

      <div class="Option" rel="Punch" id="68436-68419-68423-68427-68431">
        Punch
      </div>

      <div class="Option" rel="Sandstone" id="68437-68416-68421-68425-68429">
        Sandstone
      </div>
    </div>
  </div>
</div>

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

спасибо за ответ!

Я изучил делегат (и живой), но, к сожалению, я привязан к использованию версии 1.3.2 по независящим от меня причинам.

есть другие предложения?

1 Ответ

1 голос
/ 23 сентября 2011

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

Попробуйтечитать по http://api.jquery.com/delegate/ - это может просто решить вашу проблему или, по крайней мере, заставить ваш код работать лучше;)

...