CODEWITHSUNDEEP
javascripthtml
Vamshi
Vamshi

Reputation: 74

Bypassing The pop-up blocker for window.open() in javascript

I have a text file with some lines containing some key words. My exercise is to extract info from that file and create a html document inserting the liens in the text file with appropriate tags. for example: This is the text file:

This should be in a html tag with START as class name
THIS SHOULD BE IN A HTML TAG WITH CAPITALS AS CLASS NAME
This should be in a HTML tag with CODE as class name

Now writing a javascript program to insert those lines into HTML is very easy. I just used some string handling like this:

if(contents[i].indexOf(" CODE")!=-1){
                            w.document.write("<p class='code'>"+lines+"</p>");

                        }

I am writing all these into a new window.open object. The main problem is that pop-up blockers do not allow this functionality. So, is there any other way I can do this? I can't generate the html file physically, I need to generate it on the fly, so window.open is the only method I could think of. Are there any other ways I can accompolish this? (I can bypass the pop up blocker by just using 

w=window.open("somefile.html")
w.document.opne("somefile.html")

where somefile.html is any file. But I do not want to do it, it hardly seems a clean way.)

More over, For me to access the file, I have to host it on a server (I am currently using http-server offered by node for this) Is there any other alternative to this?

I do not want to use Jquery, I wish to accomplish all of this with vanilla javascript. But if there is a possibility of doing this with Jquery, please let me know.

Thank you very much :)

Upvotes: 0

Views: 2504

Answers (1)

Horia Coman
Horia Coman

Reputation: 8781

On principle, pop-up windows are blocked by all modern browsers. They'll ask you if you want to allow them, but otherwise they'll not allow them.

If it has to be another document, perhaps an iframe could be useful?

Here's a bunch of extra solutions:

  • Have a fake pop-up. Just a div with all the data which floats above your regular content. You can add an 'x' button to it for closing it and implement some drag-and-drop functionality. The visual effect is much the same, but the user can't treat it as an OS-level window.
  • Try to somehow integrate the content into the regular page. Either an iframe or just regular content. Modern design has passed the stage of needing pop-ups and other content outside of a single plane. Furthermore, on mobile it's unclear how pop-ups would work.
  • Open the content in a new tab. This is basically just using an <a> tag. You can put the content you wish to have in the fragment for the link, and the page you open can decode the fragment and show the info you want. Might not work with huge content.
  • Have a better flow for allowing pop-ups. Inform the user that your site needs pop-ups and make them disable it. One good way is to provide some button which triggers a pop-up, which will be blocked. Then inform them to tell the browser to allow the pop-up since most of them will show something about how the pop-up was blocked. Then you can show your regular pop-up without the risk of the user missing out on the data.

Upvotes: 1

Related Questions