How can I fix jQuery links which hang if clicked quickly

My problem is a jQuery menu which accesses a MySql DB and tends to hang, I believe, if buttons are clicked too quickly. Is there a way to deactivate all the links just until the load is complete? Or another solution?

On a WordPress site I have a custom menu of links made with jQuery to load information from MySQL into the main page area. I asked this question yesterday, and after much more research completely changed the code so I deleted the question while I reworked the issue. (Thanks to an idea from Mike Brant in my comments.)

Read More

The menu area has basic links like the following. (from Menu.php)

<ul id="mainMenu">
    <li id="buttonStyle"><a href="M1" id="Left-Menu-Text">Link 1</a></li>
    <li id="buttonStyle"><a href="M2" id="Left-Menu-Text">Link 2</a></li>
</ul>

The Accepting div for the information is included in the index.php (The Link is slightly above the loading area to accommodate for a scroll that factors in the WordPress bar.)

<a href="menuLoadAnchor" name="anchor1"></a>
    /*some code*/
<div id="loadWindow"></div>

The jQuery for the menu is as follows.

function linkScroll(aid){
    var aTag = $("a[name='"+ aid +"']");
    $('html,body').animate({
        scrollTop: aTag.offset().top
    }, 'slow' );
}
$('ul#mainMenu li a').click(function() {
    var page = $(this).attr('href');
    linkScroll('anchor1');
    $('#loadWindow').html("<center><img src='images/loading.gif' /></center>");
    $('#loadWindow').load('./wp-content/themes/themeName/menuFolder/' + page + '.php');
    return false;
});

I would not have such an issue with this as someone needs to be very impatient to have this happen. But when it does it leaves an open process that I have to log into SSH to kill. Sometimes there are many that I need to kill at once. Any advice is so very much appreciated. Thank you in advance.

I am running on the following if it helps.
Wordpress 3.5.1 jQuery 1.8.3 jQuery UI 1.9 php 5.4 MySql Ver 14.14 Distrib 5.5.30 I would have created a jFiddle but the DB eliminates that option.

For those who may find this and may have run into the same issues I found yesterday Originally I had each link going to pull a div from one single file. Which actually sent every single DB query with each click. So I had this hanging constantly. Separating them into individual files, they only sent their own query to the DB when clicked.

Related posts

Leave a Reply

1 comment

  1. Try binding and unbinding as follows:

    $(“a”).bind(‘click’, false);

    And to unbind / re-enable:

    $(“a”).unbind(‘click’, false);