|
JavaScript - Changing Parent.location.href Changes Current Page Instead
hi,
have a series of 2 pages. The first is a drop down select box that gathers the state name. Onclick we are using a window.open to open a page with a list of cities for that state. Again using a drop down select box to select the city and then, onclick, we send the user off to the appropriate page based on state/city selection while at the same time updating the 1st (parent) page with a new location.href. Problem is that instead of updating the parent page, it updates the page with the list of cities (the child page). On the first page script we generate the following warning: Warning: XUL box for _moz_generated_content_after element contained an inline #text child, forcing all its children to be wrapped in a block. Source File: chrome://browser/content/browser.xul Line: 0 First page is not generated via javascript but standard html. This happens both locally and when pages are moved to the server (Apache). First page script is as follows Code: <HTML>
<HEAD>
<TITLE>J1</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function StateSelect (form) {
Item = form.state.selectedIndex;
Result = form.state.options[Item].value;
window.open('j2.htm?value='+ Result,'myWindow','resizeable=no,resizeable=0,scrollbars=no,scrollbars=0,location=no,location=0,toolbar=no,toolbar=0,directories=no,directories=0,menubar=no,menubar=0,status=no,status=0,copyhistory=no,copyhistory=0,width=300,height=100,left=300,top=300,screenX=300,screenY=300')
}
</SCRIPT>
</HEAD>
2nd page (where user selects city) code is as follows: Code: <SCRIPT LANGUAGE="JavaScript">
function CitySelect (form) {
Item = form.city.selectedIndex;
city = form.city.options[Item].value;
state = document.myform.state.value;
window.open('j3.htm','mywindow3')
setTimeout("Func1()",3000);
}
function Func1()
{
parent.location.href='j4.htm?st='+ state + '&city=' + city,'mywinow2';
}
</SCRIPT>
Ideas on why and what the error (actually a warning) is trying to tell us? Thank you all! Jim Similar TutorialsHi, I'm using the following Javascript code to show a div layer depending on the URL Code: <script type="text/javascript">
if (location.href.match(/folder/)) {
document.getElementById("div-layer").style.display="block";
}
</script>
This works perfectly when I visit http://www.domain.com/folder but I do not want it to match any subfolders beneath /folder, for example: http://www.domain.com/folder/sub-folder http://www.domain.com/folder/sub-folder2 etc. Does anyone know how I can modify the code to only match /folder or /folder/ and no subfolders beneath it? Thank you in advance. I know next to nothing about javascript and I don't even know if this is possible. I need to target window.location.href to an iframe on a different page. So, right now, the piece of the code that redirects the browser looks like this: Code: window.location.href='http://www.somewhere.com/'; Works great, brings it up in the same browser window. So now I need to modify the code so it goes to a different page and brings that page up in a specified iframe. I hope this makes sense. I really need help. And if it is not possible, I just need to know to abandon all hope. Code: <script language="JavaScript" type="text/javascript">
function confirmDelete(url){
var decision = confirm("Click OK to delete this post.");
if(decision == true){
window.location = url;
}
}
</script>
<!--HTML LATER ON -->
<a onclick="confirmDelete('deletePost.php?id=17')" href=''><img src='delete.png' alt='' title='Delete this post' /></a>
I get absolutely nothing out of this. The confirm box pops up, but a the URL never changes when I click OK. I have no clue what's going wrong here. I'm using Google Chrome to test this out if that helps. Also does not work in Firefox. Can someone see a difference between: <input type="submit" name="Submit" value="Start" onClick="javascript:location.href='Poll_Jan2010_01.html'"> and: <input type="submit" name="Submit" value="Next >" onClick="javascript:location.href='Poll_Jan2010_02.html'"> ??? Because the first works, but the second doesnt :/ All i wanna do is move on to the next page by clicking a submit button. From the first page it moves to second correctly. After that, it only refreshes the page and doesnt move on... every time i try something it doesn't work for me god why is this javascript so hard to make it work... anyway, i just followed the guidelines to pass values from one page to another using ? and it simply, like always, DOES NOT work Code:
<HEAD>
...
...
<script type="text/javascript">
<!--
function sendme(){
if (document.form1.question[0].checked == true) { whichone = 1; }
if (document.form1.question[1].checked == true) { whichone = 2; }
if (document.form1.question[2].checked == true) { whichone = 3; }
if (document.form1.question[3].checked == true) { whichone = 4; }
if (document.form1.question[4].checked == true) { whichone = 5; }
if (document.form1.question[5].checked == true) { whichone = 6; }
if (document.form1.question[6].checked == true) { whichone = 7; }
if (document.form1.question[7].checked == true) { whichone = 8; }
myString = qst1 + "=" + whichone;
location.href = "Poll_Jan2010_02.html" + '?' + myString;
}
//-->
</script>
</head>
<body>
<div align="center">
<p><img src="63/images/poll_logo.jpg" width="655" height="92">
</p>
<p> </p>
<h2><u>Question 1</u></h2>
<p><strong>Bla bla bla bla...</strong></p>
<form name="form1">
<table width="60%" border="0">
<tr>
<td><input name="question" type="radio" value="Grill">
option 1</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Club">
option 2</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Crepes">
option 3</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Sandwiches">
option 4</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Hotdog">
option 5</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Special">
option 6</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Refreshments">
option 7</td>
</tr>
<tr>
<td><input name="question" type="radio" value="Salads">
option 8</td>
</tr>
</table>
</form>
<p>
<a href="#null" class="style2" onclick="sendme();">Continue ></a>
</p>
</div>
</body>
Ok I have tried and tried and cannot get this code to work in safari or google chrome. Basically I am working on a shopping cart. The user will click the paypal pay now button. The form is submitted to paypal via a new window target="_blank" I also need to refresh the current page. This will write shopping cart data to DB via php upon page refresh. Safari and google Chrome will open the paypal window, but seems to ignore the javascript to refresh the browser. FF and IE both work fine. Code: <script LANGUAGE="JavaScript">
function newPage() {
self.location.href=\'https://www.artists2you.com/s/orderconfirm.php?ordernumber='.$_SESSION['ordernumber'].'\';
}
</script>
Code: <form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_blank"" onSubmit=\'newPage()\'> This little snippet of code (in full) refuses to lnk properly in FF and Chrome, but IE downloads the file. Code: <tr>
<td nowrap>
<span style="font-weight: 700; font-size: 11px; background-color: #FFFF00" onclick="location.href ('http://aapress.com.au/print/headerfooteron.reg')" class="hand" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" style="font-size: 11px; font-weight: 700; background-color:#FFFF00;">
CLICK HERE</span><font size="2"> to turn </font>
<span class="hand">
<span style="font-weight: 700; font-size: 11px; background-color: #FFFF00">
ON</span></span></td>
<td nowrap width="100"> </td>
</tr>
Is there something wrong with using location.href? I guess this is an easy question for all javascripters but I don't know how to manage (I'm pretty fresh with JS). I found two solutions on this forum but it seems that they don't work(?). I want to delay for few seconds window.location.href="destination_site.html" before it will automatically take visitor to destination site. It has something to do with setTimeout but I would be greatful for posting a fixed code. Thanks in advance. Sorry my bad, but im stuck again. I have tried to search in hours, but i cant find the answer. I think you the pro coders will see the code directly. I have an webbpage, and in the middle of it there is an iframe to a php site. So i have used this code, so after some seconds the iframe will send the guest to another page. <meta http-equiv="refresh" traget="_top" content="5 url=http://mypage.com"/> But the thing is that i want the WHOLE page to reload, and go to that page after 5 seconds (we can say). With that code, only the iframe are going to another page. Is it possible to make the whole page send the user after some seconds, to another page and not only the iframe? Hi! I have one frame, for example: test.php: PHP Code: <html> <frameset border="0"> <frame src="http://codingforums.com/test2.php" /> </frameset> </html> test2.php: Code: <script> document.write(self.parent.location) </script> in the test.php is frame and in this frame is test2.php I want to print self.parent.location in test2.php but it does not work! Because test.php is subdomain and test2.php is rootdomain... Is any other way to know parent location? Many thanks... I'm sorry for my bad English. Ok so i'm trying to write a Greasemonkey script to change all the hrefs on a single page. The href by default looks like this: Code: <a href="javascript:get('246154895')" class="postid">ID</a>
What i'm trying to do is make the number from get() appear in stead of "ID". How should i get this done? I started up with this: Code: var posts = document.getElementsByClassname('postid');
for (i=0; i<posts.length; i++) {
//Replacing
}
But i doubt it will work, since there are other items with the class "postid" that aren't related to these tags i'm trying to change. P.S. I'm new to JS so yeah :P I have the index page which contains the menus with hrefs. Now i have to generate the hrefs dynamically and the problem is the menus are created by the plugin so i can edit that file So i was thinking of loading the new url in hidden elemenst and when the page loads then chnage the hrefs of those menus. I want to ask that where on the page should i display the hidden elements so that when the page loads then by using JS i can chnage the href of few menu items I was thinking of doing that on the top of page but that does not look nice to have any element before body hello i have this code that tags between three images in an certain amount of time and this works fine Code: <script language = "Javascript">
<?php $count_im=1;
$req=mysql_query("select * from banner");
while ($res=mysql_fetch_array($req)){ ?>
var image<?php echo $count_im; ?> =new Image()
image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>"
<?php $count_im++;
}?>
</script>
Code: <div class="banner">
<p class="banner_image">
<img src="banner/12.jpg" name="slide" width="290px">
<script>
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
if (step<3)
step++
else
step=1
//call function "slideit()" every ... seconds
setTimeout("slideit()",10000)
}
slideit()
//-->
</script>
</p>
</div>
and i want it also to tag between hrefs too, so tried the following but didnt work Code: <?php $count_im=1;
$req=mysql_query("select * from banner");
while ($res=mysql_fetch_array($req)){ ?>
var image<?php echo $count_im; ?> =new Image()
image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>"
var link<?php echo $count_im; ?> =new String()
link<?php echo $count_im; ?>.href="<?php echo $res["banner_title"]; ?>"
<?php $count_im++;
}?>
Code: <div class="banner">
<p class="banner_image">
<a href="" rel="nofollow" target="_blank" name="links">
<img src="banner/12.12" name="slide" width="290px"></a>
<script>
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
document.a.links.href=eval("link"+step+".src")
if (step<3)
step++
else
step=1
//call function "slideit()" every ... seconds
setTimeout("slideit()",10000)
}
slideit()
//-->
</script>
</p>
</div>
anyone can help??? Hello, Here is what I have: a regular main window that opens a small pop-up for preview purposes. This pop-up window has a text link to close it and a text link to close it and reach a page with more detail in the main window. I have been trying an infinite number of things so far and I cannot get this last link to work in Opera 10. All workarounds are just fine in FF 3 and IE 8. Here is the function called when clicking the link to "close and go": Code: <script type="text/javascript">
function fermer_extrait()
{
window.opener.location='http://www.wereIwantToGo.com';
window.close();
}
</script>
I have tried the same thing with Code: window.opener.location.href='http://www.wereIwantToGo.com'; and some other window property like "outerWidth" for testing purposes. In every case, Opera doesn't do anything when I click that link and I get this error: Code: JavaScript - http://www.mypage.php
Event thread: click
Error:
name: ReferenceError
message: Security error: attempted to write protected variable 'href'
stacktrace: Line 1 of function script
window.opener.location.href='http://www.wereIwantToGo.com'; window.close()
"protected variable" will change according to the attempt I made (href, location, outerwidth). I'm gessing there is something very strict in the way Opera handles javascript. I'm a beginner and I have reached my limits. This is where I ask for help... So, how can I get that pop-up to close and get the main window to change location? Thanks in advance for any help! ok so here is the problem in more detail i have a dropdown menu wrapped in a div attached to this div is the onmouseout event which hides the div this is working the problem however is when moving from 1 link to the next in the dropdown the onmouseout event of the wrapper div is firing and hiding the div prematurely see it live relevant code: Code: <div id="roster_drop" class="drop_menu" style="left: 128px;" onmouseout="this.style.display = 'none';"> <a href="roster.php">Superstars</a> <a href="champions.php">Champions</a> <a href="titlehistory.php">Title History</a> </div> how do i make the event only trigger when your mouse leaves the div itself and not crossing onto a link I want to implement a javascript function where a submit button will be submitted from the parent page each time I close a child page. Please let me know what I did wrong in my code and please elaborate your answer so that I could understand it better. Thank you so much for your help. I have the following jscript code but it is now working. Code: window.onunload = submitParent;
function submitParent()
{
var doc = window.opener.document,
theForm = doc.getElementById("finalForm");
theField = doc.getElementById("finalSelected");
theForm.submit();
theField.trigger('click');
}
My form from the parent page is as follow. I want my jscript to just click on the submit button once. Code: <form id = "finalForm "name= "finalForm" method="POST" action=""> <input type="Submit" id = "finalSelected" name="finalSelected"/> Hi. I am pretty sure this requires js, but if not and I am posting in the wrong section, I am sorry. Let me try to explain my situation so you know what i'm trying to accomplish. I am hosting a site on a home pc. My isp blocks inbound port 80 so I use no-ip services and port 80 redirect and cloak the address because it displays my ip instead of the domain name. For example, without the cloak it will show http://xxx.xxx.xxx.xxx:81/index.php instead of http://mydomain.com/index.php I would like to display the current page the user is on somewhere on the page. Example: You are currently viewing index.php How would I be able to accomplish this? Hi: I'm new to this forum and JS. I simply want to be able to use the Google Maps API v3 to allow a location value entered in my app (by the user) to show that location via Google maps. The code below accomplishes this via an onClick event. How to accomplish the same WITHOUT an onClick? To be clear, it appears I need to be able to perform the geocode lookup to get the long/lat coordinates and then apply them. That all needs to occur on page load. Any tips on how to re-arrange this code to accomplish the desire goal are appreciated. Thanks much. Bill Code: <html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function codeAddress() {
var address = document.getElementById("address").value;
geocoder.geocode( { address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length) {
// You should always check that a result was returned, as it is
// possible to return an empty results object.
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
map.set_center(results[0].geometry.location);
var marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map
});
}
} else {
alert("Geocode was unsuccessful due to: " + status);
}
});
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 100%; height: 100%;"></div>
<div>
<input id="address" type="hidden" value="Chicago">
<input type="button" value="Geocode It!" onClick="codeAddress()">
</div>
</body>
Hi all I have created a single page horizontally scrolling website comprised of 5 sections with a fixed navigation bar in the top right of the screen at http://www.clickmunki.com and I am trying to figure out how to highlight the active section of the site in the nav bar as the user navigates through the site so that the user knows exactly which section of the site they are in. I assumed this would be a pretty basic thing to try and do but I have not been able to achieve it so far. I have tried a few different methods but no success as yet. Can anyone point me in the right direction as to how best achieve this? Can I do it just using css or would i need some js? Any assistance would be very much appreciated.111 Kind regards Anne This is my js: Code: $(".nav").click(function(){
$(".nav.a").toggle("fast");
$(this).toggleClass("active");
});
This is my css; Code: .nav {
text-align: center;
overflow: hidden;
margin: .3em ;
width: 500px;
position: fixed;
padding: 0px 0px 0 830px;
}
.nav a {
position: relative;
float: left;
padding: 2.2em 0 3.1em;
width: 20%;
text-decoration: none;
color: #484848;
-webkit-transition: .7s;
-moz-transition: .7s;
-o-transition: .7s;
-ms-transition: .7s;
transition: .7s; }
.nav a:hover {
color: #c6342e; }
.effect {
position: absolute;
left: 120%;
-webkit-transition: 0.7s ease-in-out;
-moz-transition: 0.7s ease-in-out;
-o-transition: 0.7s ease-in-out;
-ms-transition: 0.7s ease-in-out;
transition: 0.7s ease-in-out; }
.nav a:nth-child(1):hover ~ .effect {
left: 66.3%; }
.nav a:nth-child(2):hover ~ .effect {
left: 73.8%; }
.nav a:nth-child(3):hover ~ .effect {
left: 81.2%; }
.nav a:nth-child(4):hover ~ .effect {
left: 89%; }
.nav a:nth-child(5):hover ~ .effect {
left: 96.4%; }
/* ----- dot effect -----*/
.ph-dot-nav:after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 1px;
background: #484848;
bottom: 40px;
}
.ph-dot-nav a:after {
content: "";
position: absolute;
width: 6px;
height: 6px;
bottom: 38px;
left: 50%;
margin-left: 0px;
background: #484848;
border-radius: 100%; }
.ph-dot-nav .effect {
width: 10px;
height: 10px;
bottom: 36px;
margin-left: -5px;
background: #fff;
border-radius: 100%;
z-index:999;}
Hey Basically all i want to do is highlight the pages hyperlink the user is currently on. So when the home page loads, the home page hyperlink is a different colour to the other hyperlinks, and then when another is page is pressed it is that pages hyperlink that is a different colour to the others |
|||||||