Mouseover changes text inside separate DIV

问题

Is it possible to change the text inside a separate div from a mouseover over a separate link? Would anyone know where to direct me or show me an example?

Thanks for all your help!!

Erik

回答1:

It takes a simple javascript to do this

<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>

回答2:

Here an small example with jquery:

<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>

回答3:

You could use a Javascript library like JQuery for example:

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

check the API

来源：https://stackoverflow.com/questions/3920691/mouseover-changes-text-inside-separate-div

标签

mouse

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!