Does anyone know why these event codes run twice?

E.g. I am using a cookie to keep track of [Ctrl] + [Shift] + [F] by incrementing a variable once everytime it is used. However the code for it runs twice and thus the variable is never odd as it always increments by two.

It's the same for the other events, such as [Ctrl] + [Shift] + [S], it runs twice. This was not occuring when I first inserted the cookie code last week. I have read about "bubbling" but I cannot seem to stop the code running a second time.

EDIT: Internet Explorer (6+) is only browser code needs to work in.

document.addEvent('keydown', function(event) {

	var event = new Event(event);

  	if (event.key == 'f' && event.control && event.shift) {

		// We attempt to set footerCookie
		// If cookie does not already exist, it will be set to null / false
		var footerCookie = Cookie.get('footerCookie');
		var footerCookieCount = 0;
		
		// If no cookie is set, we set the variable, footerCookieCount, to zero
		if (footerCookie == null) {
			footerCookieCount = 0
		}
		// If a cookie is set, we assign its value to the variable, footerCookieCount
		else {
			footerCookieCount = Cookie.get('footerCookie');
		}

		// Increment the variable, footerCookieCount.
		// Odd numbers mean the customer_glance is set to active
		footerCookieCount++;
		
		/*	http://docs111.mootools.net/Remote/Cookie.js#Cookie.Properties	
			Method Cookie.set()
			Arguments
			key	the key (name) for the cookie
			value	the value to set, cannot contain semicolons
			options	an object representing the Cookie options.  See Options below.  Default values are stored in Cookie.options.
			Options
			domain	the domain the Cookie belongs to.  If you want to share the cookie with pages located on a different domain, you have to set this value.  Defaults to the current domain.
			path		the path the Cookie belongs to.  If you want to share the cookie with pages located in a different path, you have to set this value, for example to “/” to share the cookie with all pages on the domain.  Defaults to the current path.
			duration	the duration of the Cookie before it expires, in days.  If set to false or 0, the cookie will be a session cookie that expires when the browser is closed.  This is default.
			secure	Stored cookie information can be accessed only from a secure environment.
			Returns	An object with the options, the key and the value.  You can give it as first parameter to Cookie.remove.
		*/
		// We create / set cookie
		// @ param cookie name
		// @ param cookie value
		// @ param path: use '/' to ensure cookie lasts for all sub-domains
		// default expiry of session / browser window open
		footerCookie = Cookie.set('footerCookie', footerCookieCount, {path: '/'});

   		$('customer_glance').toggleClass('active');

    };
    
    if (event.key == 's' && event.control && event.shift) {
			alert("one");

		if ($('edit_search') != null) {
			$('edit_search').toggleClass('active');

			if($('edit_search').hasClass('active')) {
				if ($('round1') != null) {
					$('round1').focus();
				}
			}
		}
    };
    
    if (event.key == 'n' && event.control && event.shift) {
   		$('sub_crumbs').toggleClass('active');
   		if ($('sub_crumbs').hasClass('active')) {
			$('crumbs_close_link').setStyles({
				display: 'block'
			})
			
			$('crumbs_jump_link').setStyles({
				display: 'none'
			})
		}
		
		else {
			$('crumbs_jump_link').setStyles({
				display: 'block'
			})
			
			$('crumbs_close_link').setStyles({
				display: 'none'
			})
   		}
    };   	
});

Dani AI

Generated

Short answer: event handlers that fire twice almost always mean the same handler was attached twice. As discovered, a duplicated library/include will silently produce duplicate bindings and symptoms like your counter jumping by two. Below are practical checks and small fixes to find and prevent this quickly.

Debug checklist

  • Inspect the rendered HTML for duplicate <script> tags (templates, includes, or a concatenation/bundling step can add the file twice).
  • Search the codebase for additional addEvent/bind calls that might attach the same key handler more than once (third-party widgets can do this).
  • Put a simple runtime detector in place to spot duplicate script files or duplicate binding attempts.

Runtime detector (drop into the page console)

(function(srcMatch){
  var scripts = document.getElementsByTagName('script'), i, count = 0;
  for(i = 0; i < scripts.length; i++){
    if(scripts[i].src && scripts[i].src.indexOf(srcMatch) !== -1) count++;
  }
  if(count > 1 && window.console) console.warn('Duplicate include detected:', srcMatch, 'count=', count);
})('mootools');

Quick preventive patterns

  • Prevent double-binding with a guard flag when installing handlers:
    if (!window._keyHandlerInstalled) {
    window._keyHandlerInstalled = true;
    /* attach your keydown handler here */
    }
  • Prefer centralised script inclusion (one place in the template) and avoid both CDN + local fallback that may load twice.
  • For transient debugging, add a console.log or breakpoint where you bind the handler to capture the call stack and see the duplicate caller.

Final note: bubbling/propagation can cause multiple reactions in more complex element hierarchies, but for global keydown issues the most common culprit is accidental double-inclusion or double-binding.

Problem solved, mootools1.11 was being imported twice!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.