Develop Reference

Can you tell me why this alert does not work?

Can you tell me why this alert does not work?
my js codes:
var character =
document.getElementById("character");
var block = document.getElementById("block");
function jump() {
if (character.classList != "animate") {
character.classList.add("animate");
}
setTimeout(function () {
character.classList.remove("animate");
}, 500);
var checkDead = setlnterval(function () {
var characterTop =
parseInt(window.getComputedStyle(character)
.getPropertyValue("top"));
var blockLeft =
parseInt(window.getComputedStyle(block)
.getPropertyValue("left"));
here is the if part (my problem): i want to know why it dose not work?
if (blockLeft<20 && blockLeft>0 && characterTop>=130) {
block.style.animation = "none";
block.style.display = "none";
alert("U Lose!");
}
}, 10);
}

If there will be two alert boxes when you run the code, then check the "prevent this page from creating additional dialog" checkbox. Refresh the page again and you won't get the alert box ever again.
Solution is that you need to close that webpage and reopen it again in the browser (don't need to close the entire browser). I am assuming you are using Chrome. Internet Explorer or Firefox don't have this checkbox feature.

Window.location.href not working inside an onmessage event?

I have an iframe, inside the iframe there is a form, the form is loaded either empty or with errors message or success message, very basic form, no AJAX or Axios, the page refreshes with the form & success or error messages
I am using this iframe inside another website, when my form is being submitted, I have to scroll to it from the window parent, if there an error message I scroll to it for example
Did not implement that completly, because this is not my problem
This a script I added inside the form ( and iframe of course )
<script>
let errors = document.getElementsByClassName("msg-error");
let data = [];
if(errors.length !== 0) {
for(let i = 0; i<errors.length; i++){
data.push(errors[i].classList[1]);
let anchor = errors[i].getElementsByClassName("error-anchor")[0];
anchor.id = (errors[i].classList[1] + "").trim();
}
}
window.onmessage = function(event) {
event.source.postMessage({message: "TESTForm", data}, event.origin);
};
</script>
I am sending a message to the hosting page! for now, if there is error message, their id are going to be sent the the hosting page
On the hosting page I have this :
<script>
// Main page:
window.onmessage = function (event) {
if (event.data.message === "TESTForm") {
let receivedData = event.data.data;
console.log("JOCELYN", receivedData.length === 0);
window.location.href = receivedData.length === 0 ? "#frmTestFrame-1" : "#" + receivedData[0];
}
};
</script>
I receive the message, how I know I am receiving them ?
console.log shows me when the page loads for the first time "JOCELYN true" as a result, & if there is an error it shows me "JOCELYN false"
But in either cases, I have to see an anchor in my url ? right ? in both cases, either true or false! But I don't see it at all, that my original url
Why ? I don't know, and that's why I am here!
Any help would be much appreciated really!

Window won't close when "no" is entered? Javascript

Can someone help me find the mistakes in my code? The window won't close when "no" is entered after finishing a game and I just can't seem to find the mistake.
For context: I was trying to make a battleship game and to make it interactive with javascript. When the ship is hit the user is supposed to have the option to play again (the window reloads just fine) and if the user decides that he doesn't want to play anymore he just has to enter "no" and the window closes but that doesn't work for some reason. I can't seem to find the mistake no matter what I do. Does anyone more experienced have an idea?
var table = document.getElementById("buttons");
var len_board = document.getElementsByClassName("tr").length;
var button = document.getElementsByClassName("location")
//Places ships on the board randomly
function placeShips(len_board) {
window.random_row = Math.floor(Math.random() * (len_board - 1)) + 1;
window.random_column = Math.floor(Math.random() * (len_board - 1)) + 1;
};
//Save users choice and determine if ship is hit
function getId(element) {
var chosen_row = element.parentNode.parentNode.rowIndex
var chosen_column = element.parentNode.cellIndex
if ((random_row == chosen_row) && (random_column == chosen_column)) {
element.style.backgroundColor = 'red';
element.style.borderColor = 'red';
element.textContent = "X";
alert("you hit my ship");
var answer = prompt("Would you like to play again? Enter 'Yes' for
yes and 'No' for no:");
var answer = answer.toLowerCase();
if (answer == "yes") {
location = location;
}
else if (answer == "no") {
window.close();
}
else {
var reply = prompt("I'm sorry, " + answer + " is not a valid
input. Please try again: ");
var reply = reply.toLowerCase();
if (reply == "no") {
window.close();
}
else if (answer == "yes") {
location = location;
}
else {
window.close();
};
};
}
else {
element.style.backgroundColor = "#a9c8f9";
element.style.borderColor = "#a9c8f9";
};
};

A script can only close a window that was opened by the script. You can't close the main window that loaded the script.

Window.close() on MDN
This method is only allowed to be called for windows that were opened
by a script using the window.open() method. If the window was not
opened by a script, an error similar to this one appears in the
console: Scripts may not close windows that were not opened by script.
This was done for security reasons. I'm sure you wouldn't like it if you were browsing the web and all of a sudden your window closed along with all the back history after clicking on a random link from a reddit post.
Closing the current window
In the past, when you called the window object's close() method
directly, rather than calling close() on a window instance, the
browser closed the frontmost window, whether your script created that
window or not. This is no longer the case; for security reasons,
scripts are no longer allowed to close windows they didn't open.
(Firefox 46.0.1: scripts can not close windows, they had not opened)

using onbeforeunload event, url change on selecting stay on this page

Rewriting the question -
I am trying to make a page on which if user leave the page (either to other link/website or closing window/tab) I want to show the onbeforeunload handeler saying we have a great offer for you? and if user choose to leave the page it should do the normal propogation but if he choose to stay on the page I need him to redirect it to offer page redirection is important, no compromise. For testing lets redirect to google.com
I made a program as follows -
var stayonthis = true;
var a;
function load() {
window.onbeforeunload = function(e) {
if(stayonthis){
a = setTimeout('window.location.href="http://google.com";',100);
stayonthis = false;
return "Do you really want to leave now?";
}
else {
clearTimeout(a);
}
};
window.onunload = function(e) {
clearTimeout(a);
};
}
window.onload = load;
but the problem is that if he click on the link to yahoo.com and choose to leave the page he is not going to yahoo but to google instead :(
Help Me !! Thanks in Advance
here is the fiddle code
here how you can test because onbeforeunload does not work on iframe well

This solution works in all cases, using back browser button, setting new url in address bar or use links.
What i have found is that triggering onbeforeunload handler doesn't show the dialog attached to onbeforeunload handler.
In this case (when triggering is needed), use a confirm box to show the user message. This workaround is tested in chrome/firefox and IE (7 to 10)
http://jsfiddle.net/W3vUB/4/show
http://jsfiddle.net/W3vUB/4/
EDIT: set DEMO on codepen, apparently jsFiddle doesn't like this snippet(?!)
BTW, using bing.com due to google not allowing no more content being displayed inside iframe.
http://codepen.io/anon/pen/dYKKbZ
var a, b = false,
c = "http://bing.com";
function triggerEvent(el, type) {
if ((el[type] || false) && typeof el[type] == 'function') {
el[type](el);
}
}
$(function () {
$('a:not([href^=#])').on('click', function (e) {
e.preventDefault();
if (confirm("Do you really want to leave now?")) c = this.href;
triggerEvent(window, 'onbeforeunload');
});
});
window.onbeforeunload = function (e) {
if (b) return;
a = setTimeout(function () {
b = true;
window.location.href = c;
c = "http://bing.com";
console.log(c);
}, 500);
return "Do you really want to leave now?";
}
window.onunload = function () {
clearTimeout(a);
}

It's better to Check it local.
Check out the comments and try this: LIVE DEMO
var linkClick=false;
document.onclick = function(e)
{
linkClick = true;
var elemntTagName = e.target.tagName;
if(elemntTagName=='A')
{
e.target.getAttribute("href");
if(!confirm('Are your sure you want to leave?'))
{
window.location.href = "http://google.com";
console.log("http://google.com");
}
else
{
window.location.href = e.target.getAttribute("href");
console.log(e.target.getAttribute("href"));
}
return false;
}
}
function OnBeforeUnLoad ()
{
return "Are you sure?";
linkClick=false;
window.location.href = "http://google.com";
console.log("http://google.com");
}
And change your html code to this:
<body onbeforeunload="if(linkClick == false) {return OnBeforeUnLoad()}">
try it
</body>

After playing a while with this problem I did the following. It seems to work but it's not very reliable. The biggest issue is that the timed out function needs to bridge a large enough timespan for the browser to make a connection to the url in the link's href attribute.
jsfiddle to demonstrate. I used bing.com instead of google.com because of X-Frame-Options: SAMEORIGIN
var F = function(){}; // empty function
var offerUrl = 'http://bing.com';
var url;
var handler = function(e) {
timeout = setTimeout(function () {
console.log('location.assign');
location.assign(offerUrl);
/*
* This value makes or breaks it.
* You need enough time so the browser can make the connection to
* the clicked links href else it will still redirect to the offer url.
*/
}, 1400);
// important!
window.onbeforeunload = F;
console.info('handler');
return 'Do you wan\'t to leave now?';
};
window.onbeforeunload = handler;

Try the following, (adds a global function that checks the state all the time though).
var redirected=false;
$(window).bind('beforeunload', function(e){
if(redirected)
return;
var orgLoc=window.location.href;
$(window).bind('focus.unloadev',function(e){
if(redirected==true)
return;
$(window).unbind('focus.unloadev');
window.setTimeout(function(){
if(window.location.href!=orgLoc)
return;
console.log('redirect...');
window.location.replace('http://google.com');
},6000);
redirected=true;
});
console.log('before2');
return "okdoky2";
});
$(window).unload(function(e){console.log('unloading...');redirected=true;});

<script>
function endSession() {
// Browser or Broswer tab is closed
// Write code here
alert('Browser or Broswer tab closed');
}
</script>
<body onpagehide="endSession();">

I think you're confused about the progress of events, on before unload the page is still interacting, the return method is like a shortcut for return "confirm()", the return of the confirm however cannot be handled at all, so you can not really investigate the response of the user and decide upon it which way to go, the response is going to be immediately carried out as "yes" leave page, or "no" don't leave page...
Notice that you have already changed the source of the url to Google before you prompt user, this action, cannot be undone... unless maybe, you can setimeout to something like 5 seconds (but then if the user isn't quick enough it won't pick up his answer)
Edit: I've just made it a 5000 time lapse and it always goes to Yahoo! Never picks up the google change at all.

Getting value from RadWindow OnClientBeforeClose JavaScript event

I posted a very much similar question yesterday but no one answerd so far. Now I have changed the functionality and stuck with the following problem. In this scenario, I have a RadWindow that i am opening from code behind file (.aspx page) on a button click. On this rad window I have a hidden field where I am setting value and now OnClientBeforeClose event I want to get the value from hidden field and assign it to a text box on my .ASPX page which is the parent page of this Rad Window. Could please anyone give me any idea how to do that. I have looked inot many examples on Telerik and StackOverflow but nothing working for me. Thanks in advance.
Rad Window Diclaration in my .Aspx.cs page
RadWindow window = new RadWindow();
window.Title = "Comments Pick List";
window.ID = "CommentsListPopUpRadWindow";
window.NavigateUrl = "CommentsList.aspx";
window.OnClientBeforeClose = "CommentsListPopUpRadWindowBeforeClose";
window.Skin = "Metro";
window.Behaviors = WindowBehaviors.Close;
window.KeepInScreenBounds = true;
window.VisibleStatusbar = false;
window.Modal = true;
window.Width = 750;
window.MinHeight = 510;
window.VisibleOnPageLoad = true;
window.EnableViewState = false;
RadWindowManager1.Windows.Add(window);
JavaScript function on RadWindow .ASPX page where I am setting value to the hidden field
function displayItem(id) {
var selectedText = document.getElementById(id);
document.getElementById('hiddenSelectedTextField').value = selectedText.innerText;
}
JavaScript OnClientBeforeClose function on my .ASPX parent page (to close the RadWindow) where I am trying to get value from the hidden field and set in the TextBox of parent page
function CommentsListPopUpRadWindowBeforeClose(oWnd, args) {
}

You can easily pass arguments to the RadWindow's Close function, from the child page:
function GetRadWindow() {
if (window.radWindow) {
return window.radWindow;
}
if (window.frameElement && window.frameElement.radWindow) {
return window.frameElement.radWindow;
}
return null;
}
function ChildClose() {
GetRadWindow().Close(document.getElementById('hiddenSelectedTextField').value);
}
and then retrieve the argument in the parent page by specifiying its OnClose function:
Add, in the aspx.cs file:
window.OnClientClose = "CommentsListPopUpRadWindow_OnClose";
and in the aspx parent page:
function CommentsListPopUpRadWindow_OnClose(radWindow, args) {
var arg = args.get_argument();
}