javascriptphotoswipe

Javascript inside javascript


I'm using a js gallery (photoswipe) and one of the slides isn't an image but has some html.

In that slide is event tracking on a form submit with onmousedown, which I can't get to work.

So I have:

some vars
items.push({ html: '<div and form start etc>
    <input type="submit" onmousedown="javascript:_paq.push(["trackEvent" etc ]);_paq.push(["etc"]);_paq.push(["etc"]);">
'});

I've learn by fiddling and trial and error, sorry for the newbie question.

Any ideas anyone?


Solution

  • Injecting JS in this way is not the cleanest thing to do. Instead, you could consider an more global approach with event delegation:

    Somewhere in your page, include a click listener:

    document.addEventListener('click', function (event) {
      if(event.target.classList.contains('js-track-subscribe-blog-location')) {
        _paq.push(["trackEvent","Blog","Subscribe",location.pathname.substring(1)])
      }
    })
    

    From the moment this script has run, anything on your page with the class js-track-subscribe-blog-location will trigger your tracking code when clicked.

    Simply include the class on your <input type="submit" and it should work.