Проблема передачи целочисленной переменной в событие click в javascript и jquery

Question

Это, наверное, что-то простое, но это сводит меня с ума.Я делаю некоторую нумерацию страниц, используя jquery и цикл while, который имеет переменную "pageNum", которая обновляется в конце цикла и представляет записываемую страницу.Очевидно, pageNum добавляется в конце каждой итерации.Хорошо.Вот код, который доставляет мне неприятности:

$('#page' + pageNum).click(function(){
                alert(pageNum);
            });

Так что идентификатор работает правильно и назначит клик даже для (например) пролета с идентификатором page3, если 3 является текущим pageNum.Проблема в том, что когда я щелкаю по этому диапазону, pageNum, который получает предупреждение, всегда является последним значением pageNum, которое было установлено в цикле.Так что, если есть 8 страниц, он всегда будет предупреждать 8. Итак, я подумал, что оно всегда должно получать текущее значение, поэтому я попытался передать pageNum следующим образом:

$('#page' + pageNum).click(function(pageNum){
                alert(pageNum);
            });

Но теперь предупреждение показывает [Объект Object].Я попытался создать переменные внутри и вне события click и присвоить им значение pageNum, и, похоже, ничего не работает.Это должно быть что-то действительно глупое, может кто-нибудь помочь мне?Мне нужно, чтобы текущий pageNum можно было использовать в этом событии клика.Заранее благодарим за помощь!

Answer 1

Вместо прямой ссылки на переменную pageNum, просто получите ее динамически из каждой ссылки, например:

$('#page' + pageNum).click(function(){
   alert(this.id.replace('page',''));
});

Или дай им класс, скажи .pageLink и свяжи их всех сразу, вот так:

$('.pageLink').click(function(){
   alert(this.id.replace('page',''));
});

В данный момент вы ссылаетесь на переменную single pageNum из вашего цикла, которая изменяется и заканчивается тем, что было в конце цикла. Вам нужно либо передать его в замыкание, либо полностью его игнорировать, как описано выше, или использовать данные события, переданные в .bind(), например:

$('#page' + pageNum).bind({id: pageNum}, 'click', function(e) {
   alert(e.data.id);
});

Answer 2

Третий вариант на самом деле прекрасно работает, Ник просто смешал параметры - недавно мне нужно было использовать bind таким образом для плагина, который я создаю, и он работает потрясающе! См. Ниже для исправления:

$('#page' + pageNum).bind('click', {id: pageNum}, function(e) {
   alert(e.data.id);
});

Документация jQuery прояснила это для меня; http://api.jquery.com/bind/

.bind (eventType, [eventData], обработчик (eventObject))

Answer 3

$('#page' + pageNum).click(function()
{
  var pageNum = $( this ).attr( 'id' ).match(/page([0-9]*)/)[1];

  alert( pageNum );
});