鼠標懸停更改單獨的DIV文本內的文本

是否可以通過單獨的鏈接將鼠標懸停的單獨div內的文本更改爲單獨的div？有人會知道在哪裏指導我或向我展示一個例子嗎？鼠標懸停更改單獨的DIV文本內的文本

感謝您的幫助！

埃裏克

2010-10-13 Erik

它需要一個簡單的JavaScript來做到這一點

<HTML> 
<HEAD> 
    <SCRIPT LANGUAGE="JavaScript"> 
    function changeContent() 
    { 
     document.getElementById("myDiv").innerHTML='New Content'; 
    } 
    </SCRIPT> 
</HEAD> 

<BODY> 
    <div id="myDiv"> 
    Old Content 
    </div> 
    <a href="#" onmouseover="changeContent()">Change Div Content</a> 
</BODY> 
</HTML>

來源

2010-10-13 04:10:31

我該如何處理相同內容DIV的多個鼠標滑塊？ – Erik 2010-10-13 04:16:59

我不確定你的意思是多個鼠標懸停。如果你的意思是當鼠標移出時恢復爲舊文本，那麼它的處理效果會更好。最好是使用jquery或任何其他JavaScript框架，以便您不必處理瀏覽器怪癖 – 2010-10-13 17:56:40

你可以使用JavaScript庫，例如JQuery 例如：

$('#youranchorid').mouseover(function() { 
    $('#yourdivid').html("Your new text"); 
});

check the API

來源

2010-10-13 04:19:52 mklfarha

如何讓它回落到原始文本？ – Erik 2010-10-13 04:26:30

使用函數.mouseleave（）它具有與.mousover（）相同的結構，您也可以使用.mousenter（）而不是.mouseover（） – mklfarha 2010-10-13 04:35:48

這裏的01的小例子：

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function() 
    { 
    $(".pass").hover(
     function() { 
     $(".change").text("MOUSE HOVER"); 
     }, 
     function() { 
     $(".change").text("DIV TO CHANGE"); 
     } 
     ); 
    }); 
</script> 
</head> 
<body> 
<div class="pass">PASS YOUR MOUSE OVER HERE</div> 
<div class="change">DIV TO CHANGE</div> 
</body> 
</html>

來源

2010-10-13 04:28:22

如何添加具有不同相應文本的多個鼠標懸停？ – Erik 2010-10-13 04:41:49

你是什麼意思關於多個鼠標懸停？你可以在文檔中看到函數懸停接收2個回調，第一個是鼠標離開時鼠標進入第二個回調的時候，所以在第一個回調中你可以做任何你想要的！看看文檔（http://api.jquery.com/hover/） – 2010-10-13 12:17:00

鼠標懸停更改單獨的DIV文本內的文本

回答

相關問題