如何使用Jquery切换锚文本

How to toggle the anchor text using Jquery?

本文关键字:文本 何使用 Jquery      更新时间:2023-09-26

这是我的HTML代码:

<label for="LoginControl">
<a href="login/" class="concealed noOutline">  Log in or Sign up  </a>
</label>

我需要在单击时用X替换文本"登录"或"注册",并在再次单击时返回到旧文本。

您需要一个锚点的点击处理程序:

$("a.concealed").click(function() {

现在你需要一些逻辑:

$(this).text() == "X" ? "Log in or Sign up" : "X"; //if it equals X, return Log. Else X.

现在只需组合成一个函数:

$("a.concealed").click(function() {
    var newText = $(this).text() == "X" ? "Log in or Sign up" : "X";
    $(this).text(newText);
});

演示:http://jsfiddle.net/afuub/

最好给标签一个id

<label for="LoginControl"><a id="myLink" href="login/" class="concealed noOutline">Log in or Sign up</a></label>

然后这就是你可以做到的:fiddle

HTML

    <label for="LoginControl">
     <a href="login/" class="concealed noOutline">  Log in or Sign up  </a>
    </label>

查询

   $('label a').click(function(
        $(this).toggle(
               function(){$(this).text('X')},
               function(){$(this).text('Login or Sign Up')}
   )}

阅读关于Jquery Toggle的更多信息http://api.jquery.com/toggle/