0

我的 HTML

<span class="lead_button">
  <img class="NFButtonLeft" src="/templates/web/images/0.png">
  <button type="submit" class="NFButton" id="cf_ce-submit-button">Send</button>
  <img src="/templates/web/images/0.png" class="NFButtonRight">
</span>

我想做的是，当我想添加一个名为 and 的类时，hover我想添加一个类。所以最终的输出看起来像这样spanNFhimagesbutton

<span class="lead_button">
  <img class="NFButtonLeft NFh" src="/templates/web/images/0.png">
  <button type="submit" class="NFButton NFh" id="cf_ce-submit-button">Send</button>
  <img src="/templates/web/images/0.png" class="NFButtonRight NFh">
</span>

如何使用 jQuery 实现这一点？多谢了。

4

5 回答 5

1

这正是您所需要的。

<script>
$(document).ready(function() {
    $('.lead_button').hover(function(){
        $(this).children().each(function(){
            $(this).addClass("NFh");

        });
    });
    $('.lead_button').mouseout(function(){
        $(this).children().each(function(){
            $(this).removeClass("NFh");

        });
    });
});
</script>
<span class="lead_button">
    <img class="NFButtonLeft" src="/templates/web/images/0.png">
    <button type="submit" class="NFButton" id="cf_ce-submit-button">Send</button>
    <img src="/templates/web/images/0.png" class="NFButtonRight">
</span>
于 2012-11-15T06:32:32.920 回答
0

尝试

$(document).ready(function() {
    $('span.lead_button').hover(function() {
        $(this).find('img, button').removeClass('NFH').addClass('NFH');
    });
});​
于 2012-11-15T06:17:51.797 回答
0 
$("span").hover(function() {
    $(this).children().addClass("NFh");
});
于 2012-11-15T06:18:47.963 回答
0 
$('.lead_button').hover(
    // Event on Mouse Hover
    function(){
       $(this).find('img').addClass('NFh');
       $(this).find('#cf_ce-submit-button').addClass('NFh');
    }, 
   // Event on Mouse Out
   //function(){
      // Event goes here
   //}
);
于 2012-11-15T06:19:04.997 回答
0

您可以使用.find()函数来捕获跨度内的按钮和图像元素。

$('span.lead_button').hover(function(){  
      $(this).find('img, button').addClass('NFH'); 
});

检查小提琴

于 2012-11-15T06:20:06.680 回答