addEventListener to many buttons

[Terry]

Hi all,
I have been googling this problem for many hours...
I have the following greasemonkey script;
(function()
{
if (true)
{
// Change these to match your setup
var sabcomputer = "192.168.0.20";
var sabport = "8080";


function doNzbd(event, elem)
{
elem.innerHTML = 'Contacting...';
elem.style.color = "green";
elem.disabled = 'disabled';
GM_xmlhttpRequest
(
{
method: 'GET',
url: 'http://' + sabcomputer + ':' + sabport +
'/addID?pp=3&id=' + elem.id,
headers: {'User-agent': 'Mozilla/4.0 (compatible)
Greasemonkey','Accept':'text/monkey,text/xml',},
onload: function(responseDetails)
{
if ( responseDetails.status == '200' )
{
elem.innerHTML = 'Downloading';
elem.style.color = "green";
elem.disabled = 'disabled';
}
else
{
alert('Failed to add download ' +
responseDetails.status +
' ' + responseDetails.statusText +
'\n\n' +
'Page contents:\n' +
responseDetails.responseText);
elem.innerHTML = 'Failed - Try again';
elem.style.color = "red";
}
}
}
);
event.preventDefault();
}
if (!GM_xmlhttpRequest)
{
alert('Please upgrade to the latest version of
Greasemonkey.');
return;
}

var favourites_url = '/account/favourites/add/?ps_id=';
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors;
var url = anchor.href;
var exist = url.indexOf(favourites_url);
if (exist != -1) {
var postid = url.substring(exist +
favourites_url.length,url.length);
var elmButton = document.createElement('button');
elmButton.innerHTML = "Add to sabNzbd";
elmButton.setAttribute("id", postid );
elmButton.addEventListener('click', function(event)
{doNzbd(event, elmButton);}, true);
anchor.parentNode.replaceChild(elmButton, anchor);
}
}
}

})();

The problem is that when any of the buttons are clicked, the last
button's addEventListener fires. Could someone please shed a little
light on this?

Regards,
Terry

 

[Martin Honnen]

Terry wrote:

elmButton.addEventListener('click', function(event)
{doNzbd(event, elmButton);}, true);

The problem is that when any of the buttons are clicked, the last
button's addEventListener fires.

Use

elmButton.addEventListener('click', function(event)
{doNzbd(event, this);}, true);

or

elmButton.addEventListener('click', function(event)
{doNzbd(event, event.target);}, true);

At least that should call doNnzbd with the right argument. I don't think
your description is accurate, the event listener of the clicked button
is being called only your code with the closure then calls doNsbd with
the last button created in the loop. And the suggestion above fixes that.

 

[Terry]

Thankyou very much Martin....
That has done it!....

Thanks again,
Terry