On Jan 21, 2007, at 4:00 AM, Steve Jones wrote:
Thanks Karl [Rudd].
Consider thread closed
SJ
Not so fast! :)
While it's true that your script is adding a class to the space-
separated "array" (and then removing it), that's not the real reason
why the links are still bound to the click event.
Even if you remove the class, it won't remove its binding
automatically. It's bound on $(document).ready after the DOM has
loaded, and JavaScript is going to stick with the set of elements
that are matched at that point, whether you remove the class or not.
To demonstrate this, I set up a little test page with two links. Both
links have a click event bound to their respective classes and both
remove those classes, but one will keep triggering its click event
while the other will stop after the first:
http://test.learningjquery.com/boundlink.htm
The first link uses this code:
$(document).ready(function() {
$('a.keepbound').click(function() {
$(this)
.removeClass('keepbound')
.next()
.html($(this).next().html() + ' and repeat');
});
});
The second uses this code:
$(document).ready(function() {
$('a.losebinding').one('click',function() {
$(this)
.removeClass('losebinding')
.next()
.html($(this).next().html() + ' ever');
return false;
});
});
Hope this helps explain what's going on.
cheers,
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 21, 2007, at 4:00 AM, Steve Jones wrote:
Thanks Karl.
Consider thread closed
SJ
On 21 Jan 2007, at 8:45, Karl Rudd wrote:
Yes Steve an element can have "two classes". :) The "class" attribute
of an element contains a list of space seperated "words". Think of
them more has "tags" rather than actual "OO programming" classes.
Karl Rudd
On 1/21/07, Steve Jones <[EMAIL PROTECTED]> wrote:
A question about toggleClass... everything below works, so its not a
problem as such...
http://www.g-raff.co.uk/jquery/basic.html
I added a statement to the code to change the appearance of
headings
that had been clicked, and back again when they were clicked a
second
time.
function init() {
// set first section to be open on launch
$("a.open_btn:eq(0)").toggleClass("down_state");
// now iterate through <a class="open_btn"> objects to
add click
methods to open corresponding <div class="section">
$("a.open_btn").each(function(index) {
$(this).click(function() {
$(this).toggleClass("down_state");
$('div.expandedSection:eq(' + index +
')').slideToggle("normal");
return false;
});
});
};
What I'm wondering about are the inner workings of toggleClass.
In the script above, I have applied the click method to all
instances
of a.open_btn - but of course when it's clicked, there is a "change
of class" to .down_state - yet the click method still works.
I'm just wondering how the toggleClass method is implemented, as
this
seems like voodoo to me - an element can't have 2 classes, can it?
Yet, when an "a.open_btn" becomes "a.down_state", it still retains
the click methods belonging to instances of "a.open_btn" - don't get
me wrong, I'm glad it works! But I'd prefer to understand WHY it
works.
I think I might give up Flash. This is too good...
Cheers
SJ
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
<new-logo-small.gif>
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
