Here is my HTML code:
<label for="LoginControl">
<a href="login/" class="concealed noOutline"> Log in or Sign up </a>
</label>
I need to replace the text Log in or Sign up with X when it is clicked and return to old text when clicked again.
You'll need a click handler for your anchor:
$("a.concealed").click(function() {
Now you'll need some logic:
$(this).text() == "X" ? "Log in or Sign up" : "X"; //if it equals X, return Log. Else X.
Now just combine into a function:
$("a.concealed").click(function() {
var newText = $(this).text() == "X" ? "Log in or Sign up" : "X";
$(this).text(newText);
});
It would be best if you give your a tag an id
<label for="LoginControl"><a id="myLink" href="login/" class="concealed noOutline">Log in or Sign up</a></label>
and then this is how you can do it: fiddle
HTML
<label for="LoginControl">
<a href="login/" class="concealed noOutline"> Log in or Sign up </a>
</label>
JQUERY
$('label a').click(function(
$(this).toggle(
function(){$(this).text('X')},
function(){$(this).text('Login or Sign Up')}
)}
Read more on Jquery Toggle http://api.jquery.com/toggle/
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.