The issue is not the anchor tag around the image. The issue is how
your events and actions are working. This is what your script is
doing:
- A user clicks on the image (the <a> link)
- This call updateGallery()
- updateGallery() sets an event -> "when clicking on any <a> link with
class "galleryNavHA", you do the AJAX"
- End
This doesn't actually do the AJAX. It just binds a click event.
Suppose a user clicks on that (or any) image again:
- User clicks on the image
- This calls updateGallery() AND the binded event to do the AJAX.
- updateGallery() sets another, duplicated, event -> "when clicking on
any <a> link with class "galleryNavHA", you do the AJAX"
- End
What you need to do is bind the click event on page load. If the user
has no Javascript enabled, the click binding will not be done, and the
<a> link will do its default job.
<script>
$(function() {
$(".galleryNavHA").click(function(event){
var href = this.href;
var rel = this.rel;
// do your ajax stuff
return false;
});
});
</script>
<a class="galleryNavHA" rel="http://hooker.dotnetnebraska.com/
index.php/gallery/getAjaxNavH/4/101" href=http://
hooker.dotnetnebraska.com/index.php/gallery/getAjaxMainImage/4/101
><img class="galleryNavHImg" src=http://hooker.dotnetnebraska.com/
images/o/30big.jpg /></a>
This keeps the Javascript outside of the HTML also.
On Mar 12, 11:18 am, Randall Morgan <rmorga...@gmail.com> wrote:
> Hi Yes, I have the anchors because I need to insure there is some
> functionality when js is not available. I have used anchors with my own ajax
> code without issue as long as I return false from the js function call. Is
> this a known issue with JQuery, that you can't provide a default action for
> an anchor? If it is, how to I insure the image is still available if
> javascript is turned off?
> Thank you for you help.
>
>
>
> On Thu, Mar 12, 2009 at 1:50 PM, mkmanning <michaell...@gmail.com> wrote:
>
> > Not looking any further, you have anchors with inline onclick events
> > (not considered good practice btw) which call the updateGallery()
> > function, which then binds a click event on the same anchors, every
> > time you click them again?
>
> > <a onclick="javascript:updateGallery();" class="galleryNavHA"...
>
> > You might want to rethink it a little bit :P
>
> > On Mar 12, 10:46 am, Monotoba <rmorga...@gmail.com> wrote:
> > > Hello,
>
> > > I have use ajax.load in the following function to load both a main
> > > image and an image navigation bar on a single page. The fucntion works
> > > in IE but not in FF or Chrome. I am not fluent enough (yet) with
> > > javascript or firebug to figure out what is happening. The demo page
> > > can be found at:http://hooker.dotnetnebraska.com/index.php/gallery
>
> > > /*
> > > * Updates Photo Gallery
> > > */
> > > function updateGallery() {
> > > $(".galleryNavHA").click(function(event){
> > > event.preventDefault();
> > > var href = this.href;
> > > var rel = this.rel;
> > > //$(".galleryMainImg").fadeOut("slow");
> > > $(".galleryMainImageDivCls").load(href);
> > > //$(".galleryMainImg").fadeIn("slow");
> > > $(".galleryNavDivCls").load(rel);
> > > return false;
> > > });
> > > }
>
> > > Any help getting this to work would be greatly appreciated.
>
> > > Thanks,
>
> > > R Morgan
>
> --
> If you ask me if it can be done. The answer is YES, it can always be done.
> The correct questions however are... What will it cost, and how long will it
> take?
