douzhu1188
2011-11-29 16:54
浏览 32

jQuery刷新停止jQuery悬停工作

I'm using the script below to refresh a div when the text 'view more' is clicked. The div loads a bunch of random images from the rotate.php file. For some reason though, the jquery hover effects that I have applied no longer work after the div has been refreshed. I did try adding the jquery hover script to the rotate.php file, but that stops the refresh script from working... :S Does anyone have any ideas on how you could fix this? :)

<div class="headingtext">
<script type='text/javascript'>
$(function() {
  $("#refresh").click(function(evt) {
     $(".feature").load("rotate.php")
     evt.preventDefault();
  })
})
</script><a id="refresh" href="#">View More</a>
        </div>

        <div class="feature">
            <?php include('rotate.php') ?>
        </div>

The jquery I have applied to the images, but stops working after refresh:

 $(document).ready(function(){
 $(".feature img").hover(function() {
  $(this).stop().animate({opacity: "0.5"}, 'slow');
},
function() {
  $(this).stop().animate({opacity: "1"}, 'slow');
});
});

The PHP (rotate.php):

<?php 
$random = "random.txt";
$fp = file($random);
shuffle($fp);
$keys = array_rand($fp, 3);
for ($i = 0; $i < 3; $i++):
$rl = $fp[$keys[$i]]; 
echo $rl;
endfor;
?>

图片转代码服务由CSDN问答提供 功能建议

我在点击文本“查看更多”时使用下面的脚本刷新div。 div从rotate.php文件中加载一堆随机图像。 但是出于某些原因,在刷新div后,我应用的jquery悬停效果不再起作用。 我确实尝试将jquery悬停脚本添加到rotate.php文件中,但这会阻止刷新脚本工作......:S有没有人对如何解决这个问题有什么想法? :)

 &lt; div class =“headingtext”&gt; 
&lt; script type ='text / javascript'&gt; 
 $(function(){
 $  (“#refresh”)。click(function(evt){
 $(“。feature”)。load(“rotate.php”)
 evt.preventDefault(); 
})
})
&lt  ; / script&gt;&lt; a id =“refresh”href =“#”&gt;查看更多&lt; / a&gt; 
&lt; / div&gt; 
 
&lt; div class =“feature”&gt; 
&lt;  ?php include('rotate.php')?&gt; 
&lt; / div&gt; 
   
 
 

我已应用于图像的jquery,但在之后停止工作 刷新:

  $(document).ready(function(){
 $(“。feature img”)。hover(function(){
 $(this)  .stop()。animate({opacity:“0.5”},'slow'); 
},
function(){
 $(this).stop()。animate({opacity:“1”},  '慢'); 
}); 
}); 
   
 
 

PHP(rotate.php):

 &lt;?php 
 $ random =“random.txt”; 
 $ fp = file($ random); 
shuffle($ fp); 
 $ keys = array_rand($ fp,3);  
for($ i = 0; $ i&lt; 3; $ i ++):
 $ rl = $ fp [$ keys [$ i]];  
echo $ rl; 
endfor; 
?&gt; 
   
 
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • doulun7739 2011-11-29 16:57
    已采纳

    You must use the on function ( http://api.jquery.com/on/ )

    replace :

     $(".feature img").hover(function() {
    

    by

    $(".feature img").on("mouseover", function() {
    
    已采纳该答案
    打赏 评论
  • dongqu2863 2011-11-29 17:06

    In addition to what TeChn4K said

    1. You should use both mouseenter and mouseleave (or mouseover and mouseout respectively) to handle both events
    2. Starting with jQuery 1.7 you should switch to using .on() instead of .live() ... live will be deprecated in near future
    打赏 评论

相关推荐 更多相似问题