Sign in to follow this  
Followers 0
gregor

jquery JQuery not replacing text as it should

3 posts in this topic

Hi, here's my code:

HTML


<a href="" class="button off"><div class="button toggle">on</div><img src="http://icons.iconarchive.com/icons/artdesigner/urban-stories/128/House-icon.png" /><br />DOOR</a>
[/CODE]

JQuery code AFTER HTML (in <body> tags):

[CODE]<script>
$(".button").click(function () {
$(".toggle", this).text(($(".toggle", this).text() == "on") ? "off" : "on");
});</script>[/CODE]

what it should do?

- if button toggle <div> element is set to "on", set it to off. otherwise, set ti to on. :)

what it does?

- it shows the replacement but the text imediately jumps back to "on". :(((

I'm going crazy, clueless where's the catch???

Help me please :(

Share this post


Link to post
Share on other sites

You've got nested .buttons. It's probably causing some issues.

the callback inside your text() is looking for another nested .toggle inside "this", which is the Div.toggle. I'm sure it's getting itself in a twist.

Let me get a page running....

You might need to prevent the default.


<script>
$(".button").click(function (e) {
e.preventDefault();
$(".toggle", this).text(($(".toggle", this).text() == "on") ? "off" : "on");
});</script>
[/CODE]

edit : solution

1 person likes this

Share this post


Link to post
Share on other sites

Thank you @lunaquote!

Works as charm! :)))

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.