I'd like to make a span fully clickable.
<span><a href="#" title="Remove" id="159" class="remove">159</a><input type="hidden" name="t[1][p][]" value="159"></span>
The span is assigned a background image which is floated to the right. The image is a plus sign which will basically serve to indicate the record can be moved to another div.
Rather than having a link and an image both clickable, is it possible to simply have the whole span act like a anchor?
The click must be detected by jQuery.
5 Answers
HTML:
<span id="myspan">....</span>
Script:
$("#myspan").click(function(){
alert('I got a click');
});
Make the Anchor block level (ie display:block) and it will fill the span, assuming your span itself has a defined size (otherwise it will just wrap the anchor and they will both be the same size)
$("a.remove").closest("span").click(function(){alert('Test');}); will do.
By the way, it's not a good idea to set the id to a numeric-only value. (You have the id of the a element set to "159"). This makes your markup invalid, as any identifier has to start with a latin character followed by characters, digits, dashes etc.
$('a.remove').closest('span').click(function(){
$('a.remove', this).trigger('click');
})
This will fire the link's click event too.
I think there's a problem with the fact that when you click the span, it clicks the href inside for some reason, here's a small work around.
