This line:
if ($tgt.not('form')) { //don't toggle when clicking the form!
should be :
if (!$tgt.is('form')) { //don't toggle when clicking the form!
The first always returns the jQuery object, so it's always "truthy."
The second returns a boolean. Will be true if the target element is
not a form.
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 23, 2008, at 10:27 AM, Ridge wrote:
Hm. Replaced my code with yours, and it's still toggling the form when
its clicked. :(
On May 22, 5:29 pm, Pyrolupus <[EMAIL PROTECTED]> wrote:
You need to have your event handler handle things differently
depending upon the specific child element that was clicked.
For example:
$('div#homepage_boxes> div.col').click(function(event) {
var $tgt = $(event.target);
if ($tgt.not('form')) { //don't toggle when clicking the form!
$
(this
).siblings
('.selected').andSelf().toggleClass('selected').end().end();
}
});
Seehttp://www.learningjquery.com/2008/03/working-with-events-part-1
for more complete coverage of this. It's where I learned it. :)
~Pyro
On May 22, 3:55 pm, Ridge <[EMAIL PROTECTED]> wrote:
I have this page:http://tinyurl.com/5hascg. I'm using JQuery for a
few things - :hover on the main content blocks, form validation, and
show/hide.
By themselves, everything is working great! But it's the
interoperability of the last two that are causing me a headache.
When
you click anywhere in the "For your home" box, the content appears.
There's a form in that <div>. However, when you try to focus in that
<div> by clicking, the form hides.
So, what I'd like to know is how to show the <div> contents by
clicking anywhere in the <div>, but only hide it by clicking on the
header (which I've temporarily given a background color of green to
make it stand out).
For reference, here's the contents of my $(document).ready section
which is linked from the page above. Thanks!:
$(document).ready(function(){
// Add class to shift background images on load
$('#box_home').addClass('pageload');
$('#box_business').addClass('pageload');
$('#box_account').addClass('pageload');
// Show/hide forms
$('div#homepage_boxes form').hide();
$('div#homepage_boxes> div.col').click(function() {
$
(this
).siblings
('.selected').andSelf().toggleClass('selected').end().end()
//.next('form').slideToggle('fast')
//.siblings('form:visible').slideUp('fast');
});
// Add homepage box hover effect for IE6
$('div#homepage_boxes .col').hover(function() {
$(this).addClass('ie6boxhover');
}, function() {
$(this).removeClass('ie6boxhover');
});
// Form validation
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); }
});
$("#homeform").validate({
rules: {
txtZipcode: {
required: true,
minlength: 5
}
},
messages: {
txtZipcode: {
required: "To continue processing your request, we need a
5-digit zip code. Please re-type the zip code of your service
address.",
minlength: "Your zip code must be 5-digits long. Please
re-
type the zip code of your service address."
}
}
});
});
