Итерация функции в каждом div с идентификатором, содержащим определенное слово - PullRequest
Новая
       9

Итерация функции в каждом div с идентификатором, содержащим определенное слово

0 голосов
/ 11 октября 2018

У меня есть два элемента div (они просто выглядят как блоки с заданными в CSS значениями цвета фона, ширины и высоты).Я хотел бы написать одну функцию, которая выбирает все div с идентификатором, который содержит определенное слово, в данном случае «изображение».Мои div записываются как: 

<div id="image1"> </div>
<div id="image2"> </div>

Я хочу, чтобы функция выполнялась только для каждого div, когда на него нажимают.У меня есть что-то близкое к тому, что я хочу.Он будет работать правильно при нажатии на первый div, однако после нажатия на второй div он выполнит код для обоих div.Мой код - просто временная шкала GSAP.

window.addEventListener("mousedown", function(e){
  if(e.target.id.includes("image")){
    var target = e.target;
    tl.to(target, .6, {x: ($(".container").width()/2) + (target.style.width/2), y:($(".container").height()/2) * -1 + (target.style.height/2)}, 0);
    tl.reversed() ? tl.play() : tl.reverse();
  }
})

моя временная шкала GSAP объявлена ​​над функцией как - 

var tl = new TimelineMax({paused:true, reversed:true});

Это почти работает, однако я не знаю, как изменить ее так, чтобы она выполняла толькофункция на div, который нажимается.Я попытался изменить e.target на e.currentTarget и $ (e.target), но я довольно плохо знаком с кодом и не совсем понимаю, как все эти вещи работают.

Еще одна функция, которую я пробовал, которая вообще не работает (говорит, что div не определена), это - 

$(div[id*="image"]).each(function(){
  $(this).on("click", function(){
  var target = $(this);
  tl.to(target, .6, {x: ($(".container").width()/2) + (target.style.width/2), y:($(".container").height()/2) * -1 + (target.style.height/2)}, 0);
  tl.reversed() ? tl.play() : tl.reverse();
  })
})

Любой совет очень важен, спасибо.

...