2

I have got some links like:

<a href='http://mysite.com/comment/123/edit' class='fancybox'>Edit comment</a>

And Fancybox plugin:

$(".fancybox").fancybox();

When I click on the link I'll see some page from http://mysite.com/comment/123/edit, but I want to see http://mysite.com/comment/123/edit.js.

I know there is href option, but how can I rewrite it to append .js at the end of my original href.

fl00r
  • 82,987
  • 33
  • 217
  • 237

1 Answers1

5

You can change the href attribute as you apply fancybox:

$(".fancybox").attr('href', function() { return $(this).attr('href') + '.js'; }).fancybox();

If you don't want to change the attribute (keep the link the same), but want it applied for fancybox only, use the href option you mentioned:

$(".fancybox").each(function () {
    $(this).fancybox({ href: $(this).attr('href') + '.js' });
});
Laurent
  • 3,798
  • 25
  • 22
  • Yeap, that's it. Little fix `$(this).fancybox({ href: $(this).attr('href') + '.js', ajax: {dataType: "html"} });` and it works. Thank you! – fl00r Aug 24 '11 at 16:43
  • Here is a problem: some `.fancybox` elements appends to the page dynamically after your function is triggered. Is there any way to change `href` option straight in fancybox? so I don't need to watch if there are new `.fancybox` elements on the page – fl00r Aug 24 '11 at 20:25
  • Don't you already need to rebind fancybox to those new elements? Check this previous question: http://stackoverflow.com/questions/2532070/fancybox-getting-fancybox-to-bind-using-live-to-items-being-loaded-onto-the-pa – Laurent Aug 24 '11 at 20:59