jquery更改文本并将其替换为链接

我想更改一些文本bij，当你用鼠标移动到它上面时，用url替换它。 我知道你不能通过使用动画（css）来改变它，这就是我使用淡出的原因。 在花了几个小时的时间之后，我仍然不明白为什么它不起作用

我也希望在页面中央的整个div，我尝试了valign等，但这也不起作用。这不是一个优先考虑的问题，但最好是更换页边空白处

<div align="center" style="margin-top: 20%;"> 
  <div id="change">
    <p id="big">Welcome!</p>
  </div>
  <img src="pic.JPG" alt="Logo" width="40%" height="90"/>
</div>

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$("#change").hover(
function(){
    $(this).find('p').fadeOut('slow', function() {
          $(this).text('<a href="Index.html">Continue</a>').fadeIn('slow'); 
    });
}, 
function(){
    $(this).find('p').fadeOut('slow', function() {
          $(this).text('Welcome').fadeIn('slow'); 
    });    
});
</script>

欢迎光临

$（“#更改”）。悬停(
函数（）{
$（this）.find（'p'）.fadeOut（'slow'，function（）{
$（this.text（“”）.fadeIn（'slow'）；
});
}, 
函数（）{
$（this）.find（'p'）.fadeOut（'slow'，function（）{
$（this）.text（'Welcome'）.fadeIn（'slow'）；
});    
});

---

提前谢谢

使用

html

方法：

$(this).html('<a href="Index.html">Continue</a>').fadeIn('slow'); 

$（this.html（“”）.fadeIn（'slow'）；

使用

html

方法：

$(this).html('<a href="Index.html">Continue</a>').fadeIn('slow'); 

$（this.html（“”）.fadeIn（'slow'）；

嗯，不像我想的那么容易

快速移动鼠标时，太容易触发mouseenter/over mouseleave/out，因此：

<div align="center" style="margin-top: 20%;"> 
  <div id="change">
    <p id="big">Welcome!</p>
    <p id="link" style="display:none"><a href="Index.html">Continue</a></p>
  </div>
  <img src="pic.JPG" alt="Logo" width="40%" height="90"/>
</div>

几乎奏效了。但由于进入/离开事件，您可能会在屏幕上看到这两个事件

如果我们如何使用它工作-您将需要下载并包括第一个

或者，如果您坚持更改html：

$（“#更改”）.hoverIntent（函数（）{
$（“#大”）.fadeOut（'slow'，function（）{
$（“#big”）.html（“”）.fadeIn（'slow'）；
});
},
函数（）{
$（“#大”）.fadeOut（'slow'，function（）{
$（“#big”）.html（'Welcome'）.fadeIn（'slow'）；
});
}    
);

嗯，不像我想的那么容易

快速移动鼠标时，太容易触发mouseenter/over mouseleave/out，因此：

<div align="center" style="margin-top: 20%;"> 
  <div id="change">
    <p id="big">Welcome!</p>
    <p id="link" style="display:none"><a href="Index.html">Continue</a></p>
  </div>
  <img src="pic.JPG" alt="Logo" width="40%" height="90"/>
</div>

几乎奏效了。但由于进入/离开事件，您可能会在屏幕上看到这两个事件

如果我们如何使用它工作-您将需要下载并包括第一个

或者，如果您坚持更改html：

$（“#更改”）.hoverIntent（函数（）{
$（“#大”）.fadeOut（'slow'，function（）{
$（“#big”）.html（“”）.fadeIn（'slow'）；
});
},
函数（）{
$（“#大”）.fadeOut（'slow'，function（）{
$（“#big”）.html（'Welcome'）.fadeIn（'slow'）；
});
}    
);

这是可行的，但我要做的是替换文本。当您移到上面时，将显示continue，当您移到外面时，将再次显示welcome，无需更换。不过，hover也有同样的问题，我认为我们需要hoverintent插件。这也不起作用。前面的方法改变了它，但这2个根本没有显示任何变化：s也许我应该添加我的所有代码打包在另一个div中。但它只是一个容器。。。我再也不明白了。如果你不发布完整的故事，当然帮不了你。我的代码在发布时使用html在小提琴中工作。你需要在jQuerycan通过电子邮件发送给你之后包含它吗？我不喜欢把我的整个页面都贴出来。这很有效，但我想做的是替换文本。当您移到上面时，将显示continue，当您移到外面时，将再次显示welcome，无需更换。不过，hover也有同样的问题，我认为我们需要hoverintent插件。这也不起作用。前面的方法改变了它，但这2个根本没有显示任何变化：s也许我应该添加我的所有代码打包在另一个div中。但它只是一个容器。。。我再也不明白了。如果你不发布完整的故事，当然帮不了你。我的代码在发布时使用html在小提琴中工作。你需要在jQuerycan通过电子邮件发送给你之后包含它吗？我不喜欢把我的整个页面都贴出来，这似乎不是真正的问题所在。

$("#change").hoverIntent(function(){
    $("#big").fadeOut('slow',function() {
      $("#big").html('<a href="Index.html">Continue</a>').fadeIn('slow');
    });
  },
  function(){
    $("#big").fadeOut('slow',function() {
      $("#big").html('Welcome').fadeIn('slow');
    });
  }    
);