JavaScript - Opening New Window (not New Tab)

say i have this url in my hand as a string, stored in a variable:

http://img.youtube.com/vi/wgGh9RmO5vA/default.jpg

i can copy and paste it to my browser manually and see a thumbnail.

but how can i automatically open up a browser window and i see the thumbnail? without manually copying and pasting, i want to automaticallly open a broswer window with this string

I haven't been able to find anything about this on here or clear direction on the net, so I'm hoping y'all can help me out.

I have a dropdown list that I use to navigate pages on an external website. Currently, my dropdown list will open a new page in my current window. I want to be able to open the page in a new window.

I'm sure it's a simple fix, but being somewhat of a noob to Javascript I can't figure out how to solve it.

Here's what I have for the navigation dropdown:

Code:

<FORM 
     ACTION="../cgi-bin/redirect.pl" 
     METHOD=POST onSubmit="return dropdown(this.gourl)">
<SELECT NAME="gourl">

<OPTION VALUE="">Make Your Selection
<OPTION VALUE="http://url1.html>Choice 1
<OPTION VALUE="http://url2.html>Choice 2
<OPTION VALUE="http://url3.html">Choice 3

</SELECT>

<INPUT TYPE=SUBMIT VALUE="Go">
</FORM>

And here's what I have in the header:

Code:

<SCRIPT TYPE="text/javascript">
<!--
function dropdown(mySel)
{
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if(myVal)
   {
   if(mySel.form.target)myWin = parent[mySel.form.target];
   else myWin = window;
   if (! myWin) return true;
   myWin.location = myVal;
   }
return false;
}
//-->
</SCRIPT>

Any ideas?

Hi,
I asked this in php first, but they directed me to javascript forum...

I have a variable that I obtain from a php code. This variable contains a link such as http://.......

with this variable, say $a, once I obtain it with that php code, I want a browser window to open automatically.

I dont know javascript. can you give complete code to do this?

Hi,

I am using Javascript to display options in a form with 2 dropdown lists. However, despite using the rel="nofollow" target='_self', the result opens in a new window. Help would be much appreciated.

Code:

// JavaScript Document
function setOptions(chosen) {
var selbox = document.ChronoContact_course_finder.opttwo;
 
selbox.options.length = 0;
if (chosen == ' ') {
  selbox.options[selbox.options.length] = new Option('Choose Option',' ');
 
}
if (chosen == '85') {
  selbox.options[selbox.options.length] = new Option('ITEC Beauty Specialist Diploma','index.php?option=com_content&view=article&id=49&Itemid=68',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Professional Makeup','index.php?option=com_content&view=article&id=57&Itemid=76',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Fashion Catwalk & Photographic Makeup Course','index.php?option=com_content&view=article&id=67&Itemid=91',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Bridal Makeup Course','index.php?option=com_content&view=article&id=68&Itemid=92',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Special Effects Makeup','index.php?option=com_content&view=article&id=56&Itemid=77',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Gel Nails Course','index.php?option=com_content&view=article&id=65&Itemid=88',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Acrylic Nails Course','index.php?option=com_content&view=article&id=66&Itemid=89',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Spray Tanning Course','index.php?option=com_content&view=article&id=55&Itemid=73',rel="nofollow" target='_self');  
}
if (chosen == '69') {
  selbox.options[selbox.options.length] = new Option('ITEC Holistic Massage Course','index.php?option=com_content&view=article&id=51&Itemid=2',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=78',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Indian Head Massage Course','index.php?option=com_content&view=article&id=60&Itemid=79',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Reflexology Diploma','index.php?option=com_content&view=article&id=64&Itemid=87',rel="nofollow" target='_self');
}
if (chosen == '80') {
  selbox.options[selbox.options.length] = new Option('ITEC Teaching Diploma','index.php?option=com_content&view=article&id=61&Itemid=81',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('FETAC Train The Trainer Level 6','index.php?option=com_content&view=article&id=63&Itemid=86',rel="nofollow" target='_self');
}
if (chosen == '83') {
  selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=90',rel="nofollow" target='_self');

}
}

And the HTML...

Code:

<div class="form_item">
  <div class="form_element cf_heading">
    <h1 class="cf_text">course finder</h1>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 200px;">Step 1: Choose type of course</label>
    <select name="optone" class="cf_inputbox" size="1" onchange="setOptions(document.ChronoContact_course_finder.optone.options[document.ChronoContact_course_finder.optone.selectedIndex].value);">
      <option value=" " selected="selected">Choose Option</option>
      <option value="85">Beauty courses</option>
	  <option value="69">Complimentary courses</option>
	  <option value="80">Teaching courses</option>
	  <option value="83">Fitness courses</option>	  

    </select>
    
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 200px;">Step 2: Choose a subject</label>
    <select size="1" name="opttwo" class="cf_inputbox" >
    <option value=" " selected="selected">Choose Option</option>
      
    </select>
    <!--<input type="button" name="go" value="Value Selected" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);">-->
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_button">
    <input type="submit" name="go" value="search" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);">
  </div>
  <div class="cfclear">&nbsp;</div>
    
</div>

Many thanks,
Paul

i have this code i need to close the parent.html window when the child window opened, i need the code for that working well in IE and Firefox


Parent.html


<HTML>

<SCRIPT TYPE="text/javascript">
function sendTo()
{
window.open('child.html','_blank','resizable=yes,width='+(screen.width-500)+',height='+(screen.height-500)+'');

}



</SCRIPT>



<BODY >
<form name="form">

<input type="text" value="" name="text1" id="pdetails1">
<input type="text" value="" name="text1" id="pdetails2">
</br>


<input type="submit" value="submit" onClick="sendTo()">

</BODY>
</HTML>


child.html

<html>
<body>
<form>
<input type=text name="text5" value="">
<input type=submit name="submit"value="submit">
</form>
</body>
</html>

Hello all, and thank you for your coments,

I want to preserve a 16/9 aspect ratio to the window after any resize, making the width a function of the height.

As I have a window.resizeTo() inside the window.onresize event function, the infinite loop is served. How may I quit it?


Code:

<html><head><title>Title</title><script languaje="javascript">

const c_ra=16/9;
window.onresize = function WindowReSize() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
//  myWidth = window.innerWidth;
	myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
//    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  }

myWidth = Math.floor(myHeight*c_ra);
window.resizeTo(myWidth,myHeight); // ** CAUTION resize event in a onresize event handler !
};  

</script></head><body><p>Hello World</p></body></html>

Here is the program: http://www.1728.com/newwindow.htm
Basically, I want to input a number in the input box, which assigns a number to the variable numval located at document.box1.b1.

When clicking on the "new window" button, an alert displays the input box value, then another window opens and displays the integers 1 through 12 and the amount squared.

I would like the new window to obtain the number from the previous window so that the new window will display integers (and their squares) from 1 to the value of numval.

I have created and opened a child window called "checkwin" and have written some data to it. If the data is valid, I want the user to click on the 'CONFIRM' button on the child window, at which time I want the "submit()" function for the form on the parent window to be executed. If the data is invalid the user clicks on 'MODIFY' and I want focus to return to a field on the parent form. However, when I click on the "CONFIRM" or "MODIFY" buttons on the child window, nothing happens. Here is the code:

Code:

checkwin.document.write("</td></tr><tr><td align='right'><input type='button' value='CONFIRM' 
onclick='opener.document.personnel_form.submit()'></td><td></td><td><input type='button' value='MODIFY' 
onclick='opener.document.personnel_form.first_name.focus()'></td></tr></table>")

I have the code below in my popup window which currently brings up a blank page in the background as the main window. Instead I want the popup to come up but the original page I left is in the background as the main window. Does anyone know how I can do that with the code I currently have.
Code:

<html>
<head>
 <title>JavaScript Popup Example 3</title>
</head>
<script type="text/javascript">
function poponload()
{
    testwindow = window.open("", "mywindow", "location=0,status=0,scrollbars=0,width=350,height=400");
    testwindow.moveTo(0, 0);
  testwindow.document.write('<h1>Get outta here!</h1><a href="javascript:void(0);" onclick="window.opener.history.go(-1); self.close();">Parent back button</a>');
testwindow.focus();
}
</script>
<body onload="javascript: poponload()">
</body>
</html>

Hi All,

I need to show/focus the parent window which is in back when click a link from child window in Chrome.This problem is in Chrome browser only.

We have used the below code

self.blur();
Window.opener.focus();

But this is not working in Google Chrome.

Please suggest me some workaround to achieve this.

Thanks in Advance





Reply With Quote




12-19-2014, 09:26 PM #2
Old Pedant View Profile View Forum Posts

Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts

Window is not defined.

window is.

JavaScript (and the DOM) is case sensitive. You must pay attention to upper/lower case spelling, carefully.

By the way, you shouldn't need the blur() call. If you focus on some window (any window) then any other focus should be lost.

After following the instructions from the answer below:
http://bytes.com/topic/javascript/an...arent-document

I was able to have the child window perform the function defined in the parent window.

The function was to only have an alert window pop up as the child page was loading.

I easily modified this to my intention which was to have a parent function performed when the child window was clicked.

Using the body tag:

Code:

<body onclick="parent.FUNCTION NAME HERE()">

I first change the method in which the function would be triggered, all went well there. then I tried to change which function would be triggered. (Basically use the function I wanted to happen on click of the child window rather then the function from the test). Once I did this switch, nothing happens.

The site this is being used on is:


http://tylerpanesar.ca/

What I want is when the menu bar is open in the parent window, the user chooses a link and the menu closes and goes to that link in the child window.
This already works.
However if the user opens the menu bar and then changes there mind and continues with the page the are currently on (clicks any content in the child window), the menu stays open.

Currently the menu "hides" only when you choose one of the menu items, but it does not "hide" when you CLICK on child document. If you could figure out how to get it to "hide" on a "mouse out" that would be the better option.

I attempted this method however i could only get it to "toggle" the menu on "mouse out". This method does however create an annoying flicker when you hover over the menu items (as it is toggling the open menu command I guess). If I had it "hide" the menu on "mouse out" it would "hide" as soon as you moved off of the main button. The viewer doesn't even have a chance to click a link. or at least that is what happens when I did it. You may have a better method to achieve this.

The script that tells it to hide on click is within a jQuery function:

Code:

menua
.click(
function(){
menu.hide();

the code I used for the mouseout toggle was:

Code:

menu
.mouseout(
function(){
menu.toggle();

Here is the script that I am currently using for the menu to open and the "click" hide feature.

This menu feature comes from the following help:

http://www.bennadel.com/blog/1740-Bu...-FaceBook-.htm

Code:

<script type="text/javascript">
        jQuery(function( $ ){
            var menuRoot = $( "#menu-root" );
            var menu = $( "#menu" );
            var menua = $( "#menu a" );
            // Hook up menu root click event.
            menuRoot
                .attr( "href", "javascript:void( 0 )" )
                .click(
                    function(){
                        // Toggle the menu display.
                        menu.toggle();
                        // Blur the link to remove focus.
                        menuRoot.blur();
                        // Cancel event (and its bubbling).
                        return( false );
                    }
                )
            ;
            menua
                .click(
                    function(){
                        // Toggle the menu display.
                        menu.hide();
                    }
                )
            ;
            // Hook up a click handler on the document so that
            // we can hide the menu if it is not the target of
            // the mouse click.
            $( document ).click(
                function( event ){
                    // Check to see if this came from the menu.
                    if (
                        menu.is( ":visible" ) &&
                        !$( event.target ).closest( "#menu" ).size()
                        ){
                        // The click came outside the menu, so
                        // close the menu.
                        menu.hide();
                     }
                }
            );
         });
 </script>

I've tried adding the click to "hide" menu feature to the child document but there is now menu in that document for it to "hide".

What I was trying to was have the child document execute a function from the parent document and have that function executed IN the parent document. I've tried the technique from the link in my very first post but I believe it only calls the function from the parent and executes it IN the child. Which does not work for me as the menu is not in the child.

There should be a way to make the child execute a function FOR the parent.

I apologize for this very wordy post, but I am extremely frustrated with this now as I have been trying to get this to work for a few weeks now.

Any help would be greatly appreciated.
Thanks in advance,
Tyler

Hi,

I have parent page with 10 child window and i want to close all child window when click on close session button on parent but first i need to check whether any child window open or not after that action should be done for close the child window.

I am trying to pop up a window and then do stuff(set flags) when the content of the new window is done loading. For this I am trying to detect the window.onload of the pop-up child window but so far I am unsuccessful. I believe my problem is that the URL of child window is on different domain, than the one of the opener(parent) so that the window.onload is not being called. Thought this may change, at the moment I do not have access to the code for the page I'm opening up in the pop-up. Im pretty new to web development. Any help is appreciated.

Heres my js code
Code:

//globals
var popupHandle = null;
var openingWindow = false;

function popWindow(URL){
var windowId="sameid";
if (openingWindow == true)
{
            alert("Please wait, content is still loading")
            return;
        }
        if ((popupHandle == null || popupHandle.closed)){ //is first time run or window was closed
            openingWindow = true;
            popupHandle = window.open(URL, '" + windowId + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=900,height=500');
            popupHandle.onload = function(){
                //this is the code that never executes even if I all I put in here is simple alerting
                openingWindow = false;
                windowHandle.focus();
            };
        }
        else{// window still exists, reset attributes
            if (popupHandle != null)
            {
                popupHandle.location.href = URL;
                popupHandle.focus();
            }
        }
}

Note: The whole reason why I am doing this is because if its the first time I am clicking on the button that will open this pop up window and I click it repeatedly very quickly, a new pop up is opened for each time I clicked eventhough the window.open is supposed to reuse the window if it has the same windowId. The first call to window.open takes long enough to not have a window handle ready and this allows other clicks to get through.

[help]
i have the big problem,,,
how script to make data to new window (after that, output can print) n data from previous window with datatables (datatables.net) and with default header n footer in new window???

case:

[datatable]
i search with datatable and have 3 record... and show in new window with default header n footer company , and in new window have function to print the record with header and footer.

I hope, anybody can help me..Please

thank you