Ошибка JQuery Click() - из пространства стека

Хорошо, я здесь. У меня есть элемент управления, состоящий из таблицы. Я разрешаю пользователю щелкнуть гиперссылку в нижней строке, чтобы перейти непосредственно к соответствующему представлению.Ошибка JQuery Click() - из пространства стека

С другой стороны, пользователь может щелкнуть в любом месте внутри таблицы и сделать выбор. Этот выбор активирует панель инструментов, которая позволяет пользователю выполнять некоторые задачи по выбранному элементу. Если пользователь снова нажмет на выбранный элемент, я хочу программно щелкнуть гиперссылку. Но когда я запускаю jQuery для программного нажатия на гиперссылку, я все время получаю ошибку «Out of stack space». Я полностью понимаю, что событие click вызывается рекурсивно, но я не знаю, как его предотвратить! Вот мой код ...

<head runat="server"> 
<title></title> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 

<style> 
.mouseOver, .mouseOut, .selected 
{ 
    width: 120px; 
    height: 120px; 
    text-align: center; 
    vertical-align: top; 
    display: inline-block; 
    margin: 5px; 
    cursor: pointer; 

} 
.mouseOver 
{ 
    border: solid thin #99defd; 
    background: #e9f8fe; 
} 
.mouseOut 
{ 
    border: solid thin White; 
} 
.selected 
{ 
    border: solid thin #e0a403; 
    background: #f8f4de; 
} 
</style> 

<script> 
(function($) { 
    $(document).ready(function() { 
     var $items = $('.mouseOut'); 
     $items.mouseenter(function() { 
      if ($(this).attr('class') != 'selected') 
       $(this).attr('class', 'mouseOver'); 
     }); 
     $items.mouseleave(function() { 
      if ($(this).attr('class') != 'selected') 
       $(this).attr('class', 'mouseOut'); 
     }); 

     $items.click(function() { 
      if ($(this).attr('class') == 'selected') { 
       $(this).find('a').click(); 
      } 
      else { 
       $('.selected').attr('class', 'mouseOut'); 
       $(this).attr('class', 'selected'); 
      } 
     }); 
    }); 
})(jQuery); 
</script> 
</head> 
<body runat="server"> 
    <form id="form1" runat="server"> 
     <table cellpadding="5" class="mouseOut"> 
      <tr> 
       <td> 
       user module thumbnail... 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <a id="A1" href="javascript:__doPostBack('ControlPanelHost1$cphCtrl0$lvCollectionView$ctrl0$lnkBtn','')">Users</a> 
       </td> 
      </tr> 
     </table> 

     <table cellpadding="5" class="mouseOut"> 
      <tr> 
       <td> 
       stats module thumbnail... 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <a id="A2" href="javascript:__doPostBack('ControlPanelHost1$cphCtrl0$lvCollectionView$ctrl1$lnkBtn','')">Stats</a> 
       </td> 
      </tr> 
     </table> 
    </form> 
</body>

Эта исчерпанная версия полностью продемонстрирует проблему. Спасибо всем, кто может помочь!

источник

2012-03-26 RichardB

Что это за беспорядок? (Function ($) {$ (document) .ready (function() {'? – j08691

@ j08691, это закрытие, оно выглядит только как беспорядок, потому что код не с отступом. –

Just чтобы удовлетворить мое любопытство, какова цель обертывания замыкания вокруг вызова ready() следующим образом: – Dave

По какой-то странной причине это решение работает.

Заменить:

$(this).find('a').click();

с:

window.location = $(this).find('a').attr('href');

Код, который Frédéric Hamidi при условии, был большой, но щелчок() никогда не размещение обратно на сервер.

источник

2012-03-27 04:08:02 RichardB

, кажется, функция __doPostBack не определено, что может быть причиной ошибки

источник

2012-03-26 18:17:40

Проблема заключается в том, что запуская click событие на Потомок элемента также запускает его на этот элемент, потому что событие всплывает вверх по дереву DOM , Так как ваш код запускает событие click потомка при работе с тем же событием у его предка, наступает бесконечная рекурсия.

Способ обойти эту проблему было бы использовать stopPropagation() для того, чтобы предотвратить эти события вызвали click на ваших гиперссылок из бурлит:

$(this).find("a").click(function(e) { 
    e.stopPropagation(); 
});

EDIT: Однако приведенный выше код не будет так как ваша логика также находится в обработчике событий предка. Мы можем переключить наш подход на проблему и использовать event.target с is(), чтобы вызвать событие click на гиперссылке потомка, только если событие, которое мы сейчас обрабатываем, было вызвано либо элементом предка, либо потомком, который не является самой гиперссылкой:

$items.click(function(event) { 
    if ($(this).attr('class') == 'selected' && !$(event.target).is("a")) { 
     $(this).find('a').click(); 
    } else { 
     $('.selected').attr('class', 'mouseOut'); 
     $(this).attr('class', 'selected'); 
    } 
});

источник

2012-03-26 18:28:11

Большое спасибо за сообщение. Ошибка «Вне пространства стека» исчезла, но событие click не получилось. Я добавил код, который вы разместили и добавили: $ (this) .find ('a'). Нажмите() под ним. При отладке события клика и обработчик событий, который вы написали, выполняются e.stopPropagation() это то, где потом ничего не происходит. – RichardB

Ах, глупый я, это потому, что ваша логика также находится в событии «щелчок» предка. Я уточню свой ответ. –

О, обострение!Это также работает с ошибкой «Вне пространства стека», но ничего не происходит. Судя по вашим превосходным фрагментам кода, я не смогу привязать событие click для всей таблицы. Я могу просто оставить строку, содержащую тег 'a' только при привязке события click. – RichardB

Ошибка JQuery Click() - из пространства стека

ответ

Смежные вопросы