使用jQuery更改文字onhover

我有一個文本'一個'的div裏面。當您將鼠標懸停在上面時，我想將文本更改爲「兩個」，當您停止將它懸停時，我想將文本更改回「一個」。我試圖用jQuery來做這件事，但是在它變成'two'之後，一旦你停下來，它就不會變回'one'。我究竟做錯了什麼？使用jQuery更改文字onhover

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("p").hover(function(){ 
     $(this).replaceWith("two"); 
     }, function(){ 
     $(this).replaceWith("one"); 
    }); 
}); 
</script> 

<p>one</p>

來源

2015-10-10 frosty

的[jQuery的取代上懸停元件的文本（可能的複製http://stackoverflow.com/questions/10701124/jquery-replace-文字元素的懸停） – swidmann

使用text()，因爲replaceWith()將取代整個元素，而你用文本，而不是取代它的元素，因此元素的選擇下一次丟失。

$(document).ready(function(){ 
 
    $("p").hover(function(){ 
 
     $(this).text("two"); 
 
     }, function(){ 
 
     $(this).text("one"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 

 

 
<p>one</p>

來源

2015-10-10 19:17:14 KAD

這是怎麼回事？ $（本）的.text（「二」）淡入（3000）。 – frosty

，因爲它已經可見！也許fadeOut（）？或嘗試'$（this）.text（「two」）。hide（）。fadeIn（777）;' – Anonymous0day

@ Anonymous0day Ha！所以，隱藏它，然後讓它淡入！聰明！ – frosty

$(document).ready(function(){ 
 
    $("p").hover(function(){ 
 
     $(this).html("two"); 
 
     }, function(){ 
 
     $(this).html("one"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 

 

 
<p>one</p>

來源

2015-10-10 19:21:11

使用jQuery更改文字onhover

回答

相關問題