jQuery function to open link in new window

Question

I'm trying to find a plugin or simple script to open a file in a popup window by clicking on a button. This used to work, but with all the jQuery updates (even with the migration file), this no longer works.

I found this, but this opens the popup and also redirects to the file url:

$(document).ready(function() {
$('.popup').click(function(event) {
    window.open($(this).attr("href"), "popupWindow", "width=600,height=600,scrollbars=yes");
 });
});

Any way to get a simple popup? It needs to have scrollbars, preferably resizable. I've seen lots of posts for modal boxes, but that does not accomplish what I need. The popup box has it's own design and there is more content than would be suitable for a modal.

I also want to avoid adding any extra markup. It makes the most sense to just add a class, like the example above.

Chamika Sandamal · Accepted Answer · 2013-05-15T16:48:31.840

32

Try this,

$('.popup').click(function(event) {
    event.preventDefault();
    window.open($(this).attr("href"), "popupWindow", "width=600,height=600,scrollbars=yes");
});

You have to include jQuery reference to work this, here is the working sampe http://jsfiddle.net/a7qJt/

edited May 15 '13 at 16:48

answered May 15 '13 at 16:19

Chamika Sandamal

23,565
5
63
86

@jenhan: see the sample shared – Chamika Sandamal May 15 '13 at 16:48
Thanks Chamika. I do have jQuery referenced. I think it's an IE issue. It's working in Chrome and Firefox. – jenhan May 15 '13 at 17:03

score 2 · Answer 2 · edited Mar 06 '14 at 10:11

Button click event only.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
        <script language="javascript" type="text/javascript">
            $(document).ready(function () {
                $("#btnext").click(function () {                    
                    window.open("HTMLPage.htm", "PopupWindow", "width=600,height=600,scrollbars=yes,resizable=no");
                });
            });
</script>

score 0 · Answer 3 · answered May 15 '13 at 16:20

0

Try adding return false; in your click callback like this -

$(document).ready(function() {
  $('.popup').click(function(event) {
      window.open($(this).attr("href"), "popupWindow", "width=600,height=600,scrollbars=yes");
      return false;
  });
});

answered May 15 '13 at 16:20

Adil Shaikh

44,509
17
89
111

@jenhan Do you have popups blocked by any chance? – naththedeveloper May 15 '13 at 16:48
No, I had checked that and they're not blocked. – jenhan May 15 '13 at 16:55

score 0 · Answer 4 · edited Jul 10 '13 at 12:31

0

$(document).ready(function() {
$('.popup').click(function(event) {
    window.open($(this).attr("href"), "popupWindow", "width=600,height=600,scrollbars=yes");
 });
});

edited Jul 10 '13 at 12:31

RAS

8,100
16
64
86

answered Jul 10 '13 at 12:11

dfsdf

1

score 0 · Answer 5 · answered Feb 17 '15 at 05:23

http://www.jquerybyexample.net/2012/05/open-link-in-new-tab-or-new-popup.html

$(document).ready(function() {
$('A.BLAH').click(function() {
var NWin = window.open($(this).prop('href'), '', 'height=600,width=1000');
if (window.focus)
{
NWin.focus();
}
return false;
});
});

jQuery function to open link in new window

5 Answers5

Linked