jQuery delegate() won't work with $(this)
I am currently putting together some jQuery tha开发者_高级运维t will activate slideDown() when an element is clicked that is generated by js.
Here is my function:
$('.radiowrap').delegate("span[title='yes']", "click", function() {
$('.radiowrap').next('.secondq:first').slideDown('medium');
});
This works fine but only if I specify the element (as shown above) therefore activating every matching element. If I use $(this) like so:
$('.radiowrap').delegate("span[title='yes']", "click", function() {
$(this).next('.secondq:first').slideDown('medium');
});
The code doesn't work... does anyone have a solution to this? Here is a snippet of my HTML:
<div class="option radio">
<h2 class="block">Do you have a hot water tank?</h2>
<div class="radiowrap">
<div class="radiocont">
<label>Yes</label>
<input type="radio" class="styled" value="yes" name="watertank" />
</div>
<div class="radiocont">
<label>No</label>
<input type="radio" class="styled" value="no" name="watertank" />
</div>
</div>
<div class="secondq" style="display:none;">
<h2>What type of water tank is it?</h2>
<div class="radiowrap">
<div class="radiocont">
<label>Steel</label>
<input type="radio" class="styled" value="steel" name="watertanktype" />
</div>
<div class="radiocont">
<label>Fibreglass</label>
<input type="radio" class="styled" value="Fibreglass" name="watertanktype" />
</div>
</div>
<h2 align="left">How much insulation does it have?</h2>
<input type="text" align="right" name="bonus" class="value" disabled="disabled" />
<div class="slidewrap">
<div class="sliderMm slider"></div>
</div>
</div>
</div>
Use $(this).closest(".radiowrap")
instead.
.delegate()
and .live()
try to emulate .bind()
as close as possible; thus, inside the event handler, this
points to the .radiowrap span[title='yes']
that was clicked, just as if you had bound to that <span />
directly.
Using .closest(".radiowrap")
will find the ancestor .radiowrap
of the clicked <span />
, from whence you can proceed as before.
精彩评论