Javascript jquery悬停在firefox中不起作用

我试着用鼠标悬停来改变图像，但在chrome中效果很好，但在firefox中不起作用，我只是用鼠标悬停来尝试，但同样的问题没有被触发，这是我的代码

HTML

---

这是我的

我可以确认这不是因为https。我在本地加载了这些文件，得到了与op相同的结果。这可能是由于Firefox错误，而不是编码错误

编辑

我相信我已经解决了你的问题。在我的例子中，需要在按钮上调用hover函数，而不是内部的div/img

若您希望每个按钮删除其“fullstar”状态，请在该按钮的函数末尾附加一个新函数。有关说明，请参见第一个函数

$（文档）.ready（函数（）{
var emptyStar=”http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png";
var fullStar=”http://www.ordesa.net/images/star.png";
$（'#star_1'）。悬停（函数（）{
$（this.find（'img'）.attr（'src'，fullStar）；
$（'star#u 2 img'）.attr（'src'，emptyStar）；
$（'star#u 3 img'）.attr（'src'，emptyStar）；
}，函数（）{
$（this.find（'img'）.attr（'src'，emptyStar）；
});
$（'#star_2'）。悬停（函数（）{
$（'star'u 1 img'）.attr（'src'，fullStar）；
$（'star'u 2 img'）.attr（'src'，fullStar）；
$（'star#u 3 img'）.attr（'src'，emptyStar）；
});
$（'#star_3'）。悬停（函数（）{
$（'star'u 1 img'）.attr（'src'，fullStar）；
$（'star'u 2 img'）.attr（'src'，fullStar）；
$（'star#u 3 img'）.attr（'src'，fullStar）；
});
});首先，jQuery代码太长了，您可以将其动态化并缩短，如下所示：


var-star=http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png'
var fullStarhttp://www.ordesa.net/images/star.png';
$（文档）.ready（函数（）{
$（'.star_按钮'）。悬停（函数（）{
var index=$（this.index（）；//找出我们在哪个星上
var$allStars=$（this.parent（）.children（）；//这样做是因为页面中可能还有其他评级星
$allStars.filter（':lt（'+parseInt（index+1）+'））.find（'img.star_img'）.attr（'src'，fullStar）；
$allStars.filter（':gt（'+parseInt（index）+'））.find（'img.star_img'）.attr（'src'，star）；
})/*,
函数（）{
var$allStars=$（this.parent（）.children（）；
$allStars.find（'img.star\u img'）.attr（'src'，star）；
};*/
//如果您想在向左悬停后重置星号，请取消上面的注释
});

.hover（）
接受两个参数：第一个参数是进入元素时要运行的函数，第二个参数是离开元素时要运行的函数。不在Chrome上工作btwI看不到Chrome中发生的任何事情。控制台中出现语法错误消息。很抱歉，我在fiddle中添加了另一个值，我现在已编辑！这可能是因为
firefox
阻止加载未通过
HTTPS
提供的内容（图像），如果您的页面是通过HTTPSi加载的，我不使用png-only-svg，但我认为这是同样的问题，但我不知道如何修复它感谢您的支持，如果我决定在三星级移动鼠标，如何保持fullstar？好吧，这取决于我把鼠标移到哪里。@victor我修正了我的代码，就像你离开星星一样，它们保持着最后的状态。只需删除注释行即可
<div class="stars">
<button class="star_button" type="button" >
    <div id="star_1">
        <img class="star_img" src="http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png">
    </div>
</button>
<button class="star_button" type="button" >
    <div id="star_2">
        <img class="star_img" src="http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png">
    </div>
</button>
<button class="star_button" type="button" >
    <div id="star_3">
        <img class="star_img" src="http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png">
    </div>
</button>
<button class="star_button" type="button" >
    <div id="star_4">
        <img class="star_img" src="http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png">
    </div>
</button>
<button class="star_button" type="button" >
    <div id="star_5">
        <img class="star_img" src="http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png">
    </div>
</button>
</div>

$( document ).ready(function() { 

 $('#star_1 img').hover(function() {
   $(this).attr('src', 'http://www.ordesa.net/images/star.png');
   $('#star_2 img').attr('src', 'http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png');
   $('#star_3 img').attr('src', 'http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png');
  });
 $('#star_2 img').hover(function() {
   $(this).attr('src', 'http://www.ordesa.net/images/star.png');
   $('#star_1 img').attr('src', 'http://www.ordesa.net/images/star.png');
   //
   $('#star_3 img').attr('src', 'http://reviews.acehackware.com/assets/star_empty-30fe6df72692c8a7b682c6a143b9e3f3.png');
  });
 $('#star_3 img').hover(function() {
   $(this).attr('src', 'static/dashboard/icon-star-full.svg');
   $('#star_1 img').attr('src', 'static/dashboard/icon-star-full.svg');
   $('#star_2 img').attr('src', 'static/dashboard/icon-star-full.svg');
   //
  });
});