Not able to fetch the URL / location of the pop-up window - javascript

Is there a way to fetch the URL / Location of the pop-up window?
CODE:
<html>
<head>
<script>
function openWin()
{
myWindow=window.open('http://www.google.com','','width=200,height=100');
console.debug(myWindow.location.href);
console.debug(window.location.href);
}
</script>
</head>
<body>
<input type="button" value="Open window" onclick="openWin()" />
</body>
</html>
The first console prints about:blank
While the second console prints the URL of the current page(i.e URL of the above code, it does not print the URL of the pop-up window)
Why isn't the first console printing the location (i.e http://www.google.com) ?
Can anyone help me out with this?
Thanks in advance.

Because browser security prevents you from getting the URL from any window that's not on the same domain as your script. So, if your code was running on example.com, you'd only be able to get the URL of any window that was also on example.com.

As #Hg3 says, you cannot access location.href for myWindow. window.open returns an empty DOMWindow.
However, you can overwrite window.open and maintain a simple array of all the windows you have opened.
//override window.open
var windows = [];
window._open = window.open;
window.open = function(url, name, params){
windows.push(name, url);
return window._open(url, name, params)
}
//function return href by name
function hrefByName(name) {
var index=(windows.indexOf(name));
return (index>-1) ? windows[index+1] : 'undefined';
}
//modified openWin function
function openWin(url, name) {
var params='width=200,height=100';
window.open(url, name, params);
//test, ouput current url and the windows array
console.log(hrefByName(name));
console.log(windows);
}
test markup :
<input type="button" value="google" onclick="openWin('http://google.com', 'google')" />
<input type="button" value="bing" onclick="openWin('http://bing.com', 'bing')" />
<input type="button" value="stackoverflow" onclick="openWin('http://stackoverflow.com', 'stackoverflow')" />
Of course, I guess you have a setup with dynamically generated URL's - just build random names or pass an unique number as name.

Related

Change the whole url in the address bar (Javascript)

I need a code that changes the whole url in the address bar, (in javascript).
I have already searched upon this question all over the internet and found this code
<script type="text/javascript">
function ChangeUrl(title, url) {
if (typeof (history.pushState) != "undefined") {
var obj = { Title: title, Url: url };
history.pushState(obj, obj.Title, obj.Url);
} else {
alert("Browser does not support HTML5.");
}
}
</script>
<input type="button" value="Page1" onclick="ChangeUrl('Page1', 'Page1.htm');" />
<input type="button" value="Page2" onclick="ChangeUrl('Page2', 'Page2.htm');" />
<input type="button" value="Page3" onclick="ChangeUrl('Page3', 'Page3.htm');" />
But this doesn't changes the whole URL, it just changes
localhost/index.php
to
localhost/Page1.htm
Is there a way possible to change the whole URL? like from
localhost.index.php
to
Page1.htm
No.
The History API does not let you change the apparent Origin of the page. That would be too useful for people making Phishing attacks.
You can only change the path and what follows it.
Use History.replaceState for your problem
https://developer.mozilla.org/en-US/docs/Web/API/History/replaceState

Opening a new window check if the attribute is in the new window with the page

I need help, I want code to do something like that
Open a new window, check if the attribute is in a new window with the page.
Check if the element is in the second window and return the information to the first one
<body>
<label><input type="checkbox" checked>Regulamin</label>
<br>
<button onclick="openWindow()">Otwiera okno 1</button>
<br>
<button onclick="element()">Sprawdz element</button>
<br>
<button onclick="wykrywanie()">Sprawdz wykrywanie w oknie </button>
<script>
function openWindow(){
var win = window.open('https://www.wp.pl/', '1366002941508', 'width=700,height=500,left=375,top=330');
setTimeout(function(){
win.close()
}, 3000);
return false;
}
function element(){
if ($("input").is(':checked')) {
alert('kliknięto w like');
} else{ alert('nie klik w like');
}
}
function wykrywanie(){
var newWindow = window.open('https://www.wp.pl/', '1366002941508', 'width=700,height=500,left=375,top=330');
newWindow.document.body.innerHTML = "<b>mateusztoja</b>";
newWindow.document.close();
return false;
}
</script>
</body>
If you are trying to open page with other domain:
You can't access to others domains windows/page html via javascript. You can get html from server side using some think like ..GetResponse..
It's better to use e.g. jQuery dialog instead of window.open-dialog (https://jqueryui.com/dialog/) for interactions on same domains

How can I create a function and parent.function in jquery?

The form will automatically send when page load, it will send to the iframe. But I want get the iframe content in the main page, so I create a function to test, parent.function. But I don't know where I should put this function and the parent.function. Firebug TypeErroe: parent.incomingValue is not a function. Help, appreciate.
$('#frame_form').submit();
parent.incomingValue("Hello world");
function incomingValue(val) {
alert(val)
}
<form target="iframe">
<input type="hidden" value="send"/>
</form>
<iframe name="iframe"> </iframe>
You should declare 'parent' as an object and set 'incomingValue' as a property like this:
var parent = {};
parent.incomingValue = function(val) {...}

Run Function in original page from window.open javascript

how can I run Function in original page from window.open
original_page.html
<div id="Processing" style="display:none;">
<button onclick="window.open("Processing_window.html")">open</button>
</div>
<script language="JavaScript">
function submit_form() {
var upgradeForm = document.getElementById('upgradeForm');
setTimeout("upgradeForm.submit()",3000);
}
</script>
========
Processing_window.html
<script language="JavaScript">
function Processing_window() {
var doc = window.opener.document, Processing = doc.getElementById("Processing");
Processing.style = '';
submit_form(); //Here the problem
window.close();
}
setTimeout ("Processing_window()",5000);
</script>
========
I went to run "submit_form();" funcion from Processing_window.html
To access functions from the opener, use window.opener.functionName, assuming both are in the same domain.
function Processing_window() {
var doc = window.opener.document, Processing = doc.getElementById("Processing");
Processing.style = '';
// Here's the solution
window.opener.submit_form();
window.close();
}
setTimeout ("Processing_window()",5000);
You need to HTML encode the quotation marks in the code in the attribute, or use apostrophes:
<button onclick="window.open('Processing_window.html')">open</button>
As long as the page that you open has the same origin (same server, same protocol), you can use the opener property to access the parent windows window object. There's where you find the reference to the function:
window.opener.submit_form();
You can, but not cross-domain. Only in the same domain.
<script>
function new_win_fun() {
var wind = window.open("Processing_window.html");
var upgradeForm = wind.document.getElementById("upgradeForm");
wind.setTimeout("upgradeForm.submit()",3000);
}
</script>
<button onclick="new_win_func()">Run</button>

Javascript changing values inside a iframe

I have my website
www.aplicatii-iphone.ro
and another
page.html on localhost
<html>
<head>
<title>Object References across Iframes</title>
<script type="text/javascript">
window.onload = function(){
var form = document.getElementById('testForm');
form.testBtn.onclick = sendData;
}
function notify() {
//alert('iframe loaded');
var iframeEl = document.getElementById('ifrm');
if ( iframeEl && iframeEl.parentNode && document.createElement ) {
var newTxt = document.createTextNode('The iframe has loaded and your browser supports it\'s onload attribute.');
var newPara = document.createElement("p");
newPara.className = 'demo';
newPara.appendChild(newTxt);
iframeEl.parentNode.insertBefore(newPara, iframeEl);
}
}
function sendData() { // to form inside iframed document
// frames array method:
// window.frames['ifrm'].document.forms['ifrmTest'].elements['display'].value = this.form.testEntry.value;
var ifrm = document.getElementById('ifrm');
var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document;
var form = doc.getElementById('search-input'); // <------<< search input
form.display.value = this.form.testEntry.value;
form.submit();
}
// test in iframed doc
var counter = 0;
</script>
</head>
<body>
<form id="testForm" action="#">
<p><input type="text" name="testEntry" size="30" value="[enter something]" /> <input name="testBtn" type="button" value="Click Me" /></p>
</form>
<iframe name="ifrm" id="ifrm" src="http://www.aplicatii-iphone.ro" onload="notify()" width="900">Sorry, your browser doesn't support iframes.</iframe>
</body>
</html>
And every time I press the button Click Me, I want that the state of www.aplicatii-iphone.ro to be like a user searched for that value written in "testEntry" from outside of the iframe.
I tried something there ... but I can't figure it out ... any help please?
I took the example from here http://www.dyn-web.com/tutorials/iframes/refs.php
If you know you're using a modern browser, you could use postMessage to communicate between the frames. Here's a good write-up: http://ajaxian.com/archives/cross-window-messaging-with-html-5-postmessage
If you need to support legacy browsers, you could use Google Closure's CrossPageChannel object to communicate between frames.
Unfortunatly, this is not possible due to the Same orgin policy.
And changing the document.domain-value only helps if you try to connect a subdomain with the main-domain.
Edit
If you avoid the same-orgin-problem by using a page on the same website, this should work for you:
window.frames['ifrm'].document.getElementById("search-input").value = document.getElementsByName("testEntry")[0].value;
window.frames['ifrm'].document.getElementById("cse-search-box").submit();

Categories