добавить прослушиватель щелчков сразу к нескольким кнопкам

#javascript #jquery #window.open

#javascript #jquery #окно.открыть

Вопрос:

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

 $('.IndexBody').arrive('#shortUrl', function(){
        var shortUrl = $('#shortUrl').text();
        var socialTags = ['.entypo-twitter', '.entypo-facebook', '.entypo-gplus'];
        var socialLinks = ["http://twitter.com/share?text=http://" shortUrl " — Link made by ",
                           "https://www.facebook.com/sharer/sharer.php?u=" shortUrl "amp;amp;src=sdkpreparse",
                           "https://plus.google.com/share?url=" shortUrl];
        console.log(socialLinks);
        for(var i=0; i<3; i  ){
          $(socialTags[i]).click(function(e) {
            var width  = 575,
                height = 400,
                left = ($(window).width()  - width)  / 2,
                top    = ($(window).height() - height) / 2,
                opts   = 'status=1'  
                         ',width='    width   
                         ',height='   height  
                         ',top='      top     
                         ',left='     left;
            window.open(socialLinks[i], 'facebook', opts);
            console.log(socialLinks[i]);
            return false;
          })
        }
      });
  

Комментарии:

1. Должно " — Link made by " быть экранировано?

2. $(socialTags.join(',')).on('click', HANDLER)

3. ignaciothayer.com/post/…

Ответ №1:

Проблема в том, что вы записываете данные i внутри замыкания, поэтому его значение при нажатии кнопки будет текущим значением, а не значением при создании функции.

Попробуйте что-то вроде этого:

 for(var i=0; i<3; i  ){
  $(socialTags[i]).click(createHandler(socialLinks, i));
}

function createHandler (socialLinks, i) {
    return function (e) {
        var width  = 575,
            height = 400,
            left   = ($(window).width()  - width)  / 2,
            top    = ($(window).height() - height) / 2,
            opts   = 'status=1'  
                     ',width='    width   
                     ',height='   height  
                     ',top='      top     
                     ',left='     left;
        window.open(socialLinks[i], 'facebook', opts);
        console.log(socialLinks[i]);
        return false;
    };
}
  

Комментарии:

1. Будет ли handler() вызываться внутри for цикла?

2. Да, обработчик выполняется во время выполнения цикла и возвращает функцию, которая выполняется при нажатии кнопки. Таким образом, значение i во время цикла (нужное вам значение) сохраняется в аргументе функции-обработчика (также вызываемой i ).

3. handler вероятно, было бы лучше назвать createHandler — обновленный.

4. Вероятно, это самая распространенная проблема, с которой сталкиваются люди при переходе на Javascript с других языков. Затворы становятся невероятно мощными, как только вы с ними освоитесь 🙂

5. Я только что попробовал это. Массив социальных ссылок, похоже, работает. но прослушиватель щелчков не добавляется к кнопкам. Он ничего не делает, когда я нажимаю кнопки