jQuery将脚本应用于页面上的所有div [英] jquery apply script to all divs on page

问题描述

我有一些动态创建的div.他们看起来像这样:

I have some divs that get created dynamically. they look like this:

<div class="item-logo"><img src="http://www.glitters20.com/wp-content/uploads/2012/11/Funny-Face-9.jpg" /></div>
    <div class="item-move">No Move</div> 
    <div class="item-movee">No Move</div>
    <div class="item-moveee">No Move</div> 
    <div class="item-moveeee">Move Me</div> 

        <div class="item-logo"><img src="http://www.glitters20.com/wp-content/uploads/2012/11/Funny-Face-9.jpg" /></div>
    <div class="item-move">No Move</div> 
    <div class="item-movee">No Move</div>
    <div class="item-moveee">No Move</div> 
    <div class="item-moveeee">Move Me</div> 

这是我要尝试执行的操作，因此我可以为每个div执行一个脚本.这是我的脚本不起作用:我想移动.item-moveeee

Here is what I am trying to do so I can have one script that will execute for each div. Here is my script that is not working: I want to move .item-moveeee

$(".item-logo").mouseover(function() {
    // Set the effect type
    var effect = "slide";

    // Set the options for the effect type chosen
    var options = { direction: "left" };

    // Set the duration (default: 400 milliseconds)
    var duration = 500;

    $(this).next().toggle(effect, options, duration);

  }).mouseout(function(){
     $(this).next().hide('slide',{direction:'left'});
});

这是一个不起作用的小提琴: http://jsfiddle.net/daveferrara1/4gBGq/

Here is a fiddle that is not working: http://jsfiddle.net/daveferrara1/4gBGq/

任何帮助将不胜感激:

推荐答案

感谢@keypaul在这里，小提琴 jsfiddle.net /keypaul/U2w37

Thanks to @keypaul Here the fiddle jsfiddle.net/keypaul/U2w37

<div class="wrapper">
<div class="item-logo"><img src="http://www.glitters20.com/wp-content/uploads/2012/11/Funny-Face-9.jpg" /></div>
    <div class="item-move0">No Move</div> 
    <div class="item-move1">No Move</div>
    <div class="item-move2">No Move</div> 
    <div class="item-move3">Move Me</div>
</div>
<div class="wrapper">
        <div class="item-logo"><img src="http://www.glitters20.com/wp-content/uploads/2012/11/Funny-Face-9.jpg" /></div>
    <div class="item-move0">No Move</div> 
    <div class="item-move1">No Move</div>
    <div class="item-move2">No Move</div> 
    <div class="item-move3">Move Me</div>
</div>


$(".item-logo").mouseover(function() {
    // Set the effect type
    var effect = "slide";

    // Set the options for the effect type chosen
    var options = { direction: "left" };

    // Set the duration (default: 400 milliseconds)
    var duration = 500;
    $(this).parent().find('.item-move3').toggle(effect, options, duration);

  }).mouseout(function(){
      $(this).parent().find('.item-move3').hide('slide',{direction:'left'});
});

这篇关于jQuery将脚本应用于页面上的所有div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！