jquery，我的功能执行很多时间而不是一个

当我点击.myClass我想'a'出现在＃消息之前，不幸的是'a a a'出现而不是它。jquery，我的功能执行很多时间而不是一个

我的CSS是：

#message{ 
    width: 80%; 
    height: 10%; 
    border-style:solid; 
    border-width:5px; 
} 


.hideIt{ 
    visibility:hidden; 
}

，我的代码是：

<div id="message">test1 <span class="myClass hideIt">test2</span></div> 

    <script src="jquery.js"></script> 
    <script> 
    $(function() { 

     test = function() { $('#message').before('a '); } 

     $(document).on('mouseover', '#message', function() { 
      var el = $(this); 
      el2 = el.children('.myClass'); 
      el2.removeClass('hideIt'); 
      el2.on('click',test); 
      el.on('mouseout', function() { 
       el2.addClass('hideIt'); 
      }); 
     }); 

    }); 
    </script>

这里小提琴链接：http://jsfiddle.net/TDJVw/

来源

2013-04-09 Gradislava Bikkulova

您正在注册一个点击处理程序，每次#message被徘徊。你需要.off（）那个点击处理程序，或者把它放在mouseover处理程序之外（取决于你想完成什么） – yoavmatchulsky 2013-04-09 07:48:50

@yoavmatchulsky是.off（）的正确语法：$（document）.off（ 'mouseout'，'#message'，test）; ?? – 2013-04-09 08:01:34

我已经更新了你的提琴：

http://jsfiddle.net/TDJVw/8/

$(document).on('mouseover', '#message', function() { 
    $(this).find('.myClass').removeClass('hideIt'); 
}).on('mouseout', '#message', function() { 
    $(this).find('.myClass').addClass('hideIt'); 
}) 

$('#message .myClass').on('click', test);

我感动mouseover处理

编辑之外click和mouseout事件处理程序：哎呀，我忘了补充#message到第二个.on（）

来源

2013-04-09 07:54:13 yoavmatchulsky

如果尝试

test = function() { $('#message').html('a '); }

这将会把' a'a 'test1'的地方。这是你的要求吗？

来源

2013-04-09 07:50:16 vinothini

这里检查这个小提琴http://jsfiddle.net/TDJVw/1/它会做你想做的。

您的问题是，您每次挂起div时都注册了click方法。我在hover方法之外移动了click。

来源

2013-04-09 07:50:48

哦，我明白了，非常感谢 – 2013-04-09 07:56:13

您的代码仍然会注册多个'mouseout'处理程序，这些处理程序是冗余的。你只需要一个 – yoavmatchulsky 2013-04-09 08:01:25

jquery，我的功能执行很多时间而不是一个

回答

相关问题