最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - jQuery toggle running twice - Stack Overflow

programmeradmin9浏览0评论

It seems that this code:

$(function(){
    $('.show_hide_login').toggle(
    function (){
            alert('show');
            $("div#fullpage").show();
            $("div#loginbox").show();
        },
  function (){
            alert('hide');
            $("div#loginbox").hide();
            $("div#fullpage").hide();
        }
  ); });

Any idea on why it would be running twice when I click on either link (two, one is a div and one is an anchor)?

It seems that this code:

$(function(){
    $('.show_hide_login').toggle(
    function (){
            alert('show');
            $("div#fullpage").show();
            $("div#loginbox").show();
        },
  function (){
            alert('hide');
            $("div#loginbox").hide();
            $("div#fullpage").hide();
        }
  ); });

Any idea on why it would be running twice when I click on either link (two, one is a div and one is an anchor)?

Share Improve this question asked Sep 9, 2010 at 23:03 NathanNathan 811 silver badge2 bronze badges 1
  • 1 Is it possible your script above is running twice? Put an alert before the .toggle() call to see if that's the case. – Nick Craver Commented Sep 9, 2010 at 23:11
Add a ment  | 

4 Answers 4

Reset to default 5

How many elements do you have with the .show_hide_login class? I'll guess you have two of those. In which case, $('.show_hide_login') result contains two elements, and toggle() is executed for each of them.

This isn't an answer to your question, but you could clean up your code a bit like so:

$(function() {
    $('.show_hide_login').toggle(
    function() {
        alert('show');
        $("#loginbox,#fullpage").show();
    }, function() {
        alert('hide');
        $("#loginbox,#fullpage").hide();
    });
});

As to your actual problem, I suspect Nick's guessed the culprit. Check out this demo to see the result of binding the same event twice: http://jsfiddle/9jPLv/

In addition to adding an alert prior to the binding of the toggle event, you could add in an unbind() and see if that solves the problem, like so:

$('.show_hide_login').unbind().toggle(

If that solves it, the toggle binding is definitely being run twice, so you'd just have to figure out why.

my answer is just a kind of checkpoint,i had the same issue but for different reason. I did include the script file in base page as well as child page. this resulted in toggle running twice if you have this problem check that the script is added only once.

It might be the same issue i was having.

so if you got an element with a script tag in it - then you move that containing element or wrap it with another tag in jquery - then the ready function in jquery is executed again - thus binding a second toggle function to your element.

as suggested $('.show_hide_login').unbind().toggle( is a workaround that does work, but better to try moving your javascript code to the head or bottom of the page.

发布评论

评论列表(0)

  1. 暂无评论