I need to open a new tab when a user is scrolling in my website.
The problem is, as far as i understand, that in order for a new tab to open automatically without a pop-up warning from the browsers, the user must first trigger an event in the DOM but apparently onscroll() does not count as one.
Is there a way for me to trigger an even when a user is scrolling in my website that will allow me to open a new tab without the pop-up alert from the browser?
This is currently my code:
window.onscroll = function(ev) {
if(clicked === 1) {
return false;
}
clicked = 1;
var win = window.open('<?php echo $redirect ?>', '_blank');
win.focus();
};
That is native browser functionality and its a good one.
Just imagine if every site could pollute your browser with a number of tabs.
For it to work the user has to accept and allow popups from your domain
Related
Hello I am trying to open a new URL on page exit in a browser window using javacript. My goal is when user closes the window to see the javascript alert box and when he press "Leave this Page" Instead ot the browser window to be closed to be redirected to google.com.
my code so far is the following:
<script type="text/javascript">
$(document).ready(function(){
var areYouReallySure = false;
var internalLink = false;
function areYouSure() {
if (!areYouReallySure && !internalLink) {
areYouReallySure = true;
location.href="http://www.google.com"
return "Do you wish to go to google?";
}
}
window.onbeforeunload = areYouSure;
$('a').click(function(){
internalLink = true;
});
});
</script>
Rigth now when I chose leave this page it only closes the window.
This is impossible, and with good reason. Imagine if spam sites controlled what happens when you close their page. As a security measure, the only thing you can do when a user tries to navigate away from your page is display a message. This was implemented mostly so users can be warned that they haven't saved their data.
In my MVC project I have a button which opens a page in new tab. On button click, the page is opened on new page and the button should be disabled. When the user closes the tab, I want to enable the button. Is there any way I could do this in jquery or javascript? I have searched the web but no answer.
Conceptual idea would be to maintain a reference to the opened window in outer context (module or global variable), so that it can be easily accessed from your code. Here is the example:
var windowsArray = [];
function addWindowInTab() {
var newWindow = window.open('page.html', '_newtab');
windowsArray[windowsArray.length] = newWindow;
newWindow.onunload=enableButton;
}
function removeWindowTab(newWindow){
var idx = array.indexOf(newWindow);
if(idx != -1) {
windowsArray.splice(idx, 1);
}
}
function enableButton(){
$("#myButton").removeAttr("disabled");
}
//somewhere in MVC page
$(function(){
$("#buttonOpenWindow").click(function(){
addWindowInTab();
});
//later, when a button should be disabled...
if (windowsArray.length){
$("#myButton").attr("disabled", "disabled");
}
});
Note also, that here you can perform some more advanced checks, such as if window with particular name is opened or if multiple windows are opened. Bear in mind that in order to open a new tab, the AddWindowInTab function must be called in response to user action, such as pressing Ctrl+ clicking the left mouse button
I have a link on my site that opens a new window to a page that plays a very long audio file. My current script works fine to open the page and not refresh if the link is clicked multiple times. However, when I have moved to a seperate page on my site and click this link again, it reloads. I am aware that when the parent element changes, I will lose my variable and thus I will need to open the window, overiding the existing content. I am trying to find a solution around that. I would prefer not to use a cookie to achieve this, but I will if required.
My script is as follows:
function OpenWindow(){
if(typeof(winRef) == 'undefined' || winRef.closed){
//create new
winRef = window.open('http://samplesite/page','winPop','sampleListOfOptions');
} else {
//give it focus (in case it got burried)
winRef.focus();
}
}
You should first to call winRef = window.open("", "winPopup") without URL - this will return a window, if it exists, without reloading. And only if winRef is null or empty window, then create new window.
Here is my test code:
var winRef;
function OpenWindow()
{
if(typeof(winRef) == 'undefined' || winRef.closed)
{
//create new
var url = 'http://someurl';
winRef = window.open('', 'winPop', 'sampleListOfOptions');
if(winRef == null || winRef.document.location.href != url)
{
winRef = window.open(url, 'winPop');
}
}
else
{
//give it focus (in case it got burried)
winRef.focus();
}
}
It works.
Thanks to Stan and http://ektaraval.blogspot.ca/2011/05/how-to-set-focus-to-child-window.html
My solution creates a breakout pop-up mp3 player that remains active site wide and only refreshes if the window is not open prior to clicking the link button
function OpenWindow(){
var targetWin = window.open('','winPop', 'sample-options');
if(targetWin.location == 'about:blank'){
//create new
targetWin.location.href = 'http://site/megaplayer';
targetWin.focus();
} else {
//give it focus (in case it got burried)
targetWin.focus();
}
}
Like you said, after navigating away from original page you're losing track of what windows you may have opened.
As far as I can tell, there's no way to "regain" reference to that particular window. You may (using cookies, server side session or whatever) know that window was opened already, but you won't ever have a direct access to it from different page (even on the same domain). This kind of communication between already opened windows may be simulated with help of ajax and server side code, that would serve as agent when sharing some information between two windows. It's not an easy nor clean solution however.
I use window.open to populate a new window with varying content. Mostly reports and stored HTML from automated processes.
I have noticed some very inconsistent behavior with Chrome with respect to window.open().
Some of my calls will create a new tab (preferred behavior) and some cause popups.
var w = window.open('','_new');
w.document.write(page_content);
page_content is just regular HTML from AJAX calls. Reports contain some information in the header like title, favicon, and some style sheets.
In IE9 the code does cause a new tab instead of a pop-up, while Chrome flatly refuses to show the content in question in a new tab. Since the content is sensitive business data I cannot post it here. I'll answer questions if I can.
I know some people will say this is behavior left up to the user, but this is an internal business platform. We don't have time to train all the users on how to manage popups, and we just need it to be in a new tab. Heck, even a new window would be preferable to the popup since you cannot dock a popup in Chrome. Not to mention none of the popup blocking code would affect it.
Appreciate any insight.
window.open must be called within a callback which is triggered by a user action (example onclick) for the page to open in a new tab instead of a window.
Example:
$("a.runReport").click(function(evt) {
// open a popup within the click handler
// this should open in a new tab
var popup = window.open("about:blank", "myPopup");
//do some ajax calls
$.get("/run/the/report", function(result) {
// now write to the popup
popup.document.write(result.page_content);
// or change the location
// popup.location = 'someOtherPage.html';
});
});
You can try this:
open a new tab please
<script>
function openWindow(){
var w = window.open("about:blank");
w.document.write("heheh new page opened");
}
</script>
Is very easy, in order to force Chrome to open in a new tab, use the onmouseup event
onmouseup="switchMenu(event);"
I have tried this and it worked fine in chrome. If opening a new tab is on a user action(such as a mouse click) this will work fine without any issues. But if the code is executed in another script block, you may need to enable pop-ups in chrome. Looks like this is to handle all the click-bait sites.
let newTab = window.open('', '_blank');
if (this.viewerTab == null) {
console.log("opening in new tab to work, pop-ups should be enabled.");
return;
}
................
newTab.location.href = viewerUrl;
window.open('page.html', '_newtab');
Specify the '_newtab'. This works in IE and FF, and should work in Chrome. But if the user has things configured to not open in new tab then not much you can do.
I am trying to open a new pop up for my application, and each popup has a window name. Suppose if the user closes the popup he can open the popup with same name, else the existing pop up should be displayed.
I wrote the below code to do that, but this is not opening a popup if the user closes it else its opening a new popup. Please suggest how can go with this.
d='javascript:if(document.getElementsByTagName("*").length>0&&document.getElementsByTagName("body")[0].innerHTML!=""&&!confirm("You are about to navigate to home page Do you want to do that ? "))
{opener.display2WindowHelp();}
else
{window.location.replace("${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}'+d+'");
}';
b= window.open(d,"_spor_window_"+a+window.location.hostname.replace(/\./g,""),"menubar=no,scrollbars=yes,height="+screen.availHeight+",width="+screen.availWidth+",left=0,top=0,resizable=yes,toolbar=no,location=no,status=no");
If you need to open any popups, there are likely better ways to meet your requirements. If you are opening several popups, then your design needs a thorough review (consider your workflow and whether a tabbed interface is a better option).
The usual strategy is to save a reference to each window, then check if it's still open and available for re-use later, e.g.
var popWin;
function openWindow(url) {
var windowName = '...';
var features = '...';
if (!popWin || popWin.closed) {
popWin = window.open(url, windowName, features);
} else {
popWin.location.href = url;
}
}
If you want to have multiple windows open, then you will need a strategy for tracking which one you want to load a particular resource into.
You may find the HTML5 window (creating and navigating contexts by name) and MDN window.open documentation useful.