|
JavaScript - Check If The Html Url Is Opened In The Tab/window
Here is my scenario, i have a html that allows the user to retrieve .pdf file from the server.
If the users are trying to open the html again, mean the user open a new tab/window to the same html url, the window will prompt the user that the html is already opened. The user will need to close the old html tab/window first before open a new one. Is it possible to stop the users to open the new same html file before he/she closes the old one ? Is there any link that teach the tutorial about this ? I am wondering do i need to use cookies in the browser to store the url in order to compare to the new tab/window url ? Thanks for helping. I appreciate this a lot. Similar Tutorialsi 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> 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. Hi, I have a thumbnail gallery on my website. The thumbnails can be opened in a new window using: Code: <a href="/images/flowers22.jpg" rel="nofollow" target="_blank"><img src="images/flowers.jpg" alt="flowers" onClick="MM_openBrWindow('/images/flowers22.jpg','','status=yes,width=630,height=379');return false" /></a>
I have inserted javascript code into my .js stylesheet to disable the right clicking of images on the page where the thumbnails a Code: var clickmessage="Apologies, images cannot be copied."
function disableclick(e) {
if (document.all) {
if (event.button==2||event.button==3) {
if (event.srcElement.tagName=="IMG"){
alert(clickmessage);
return false;
}
}
}
else if (document.layers) {
if (e.which == 3) {
alert(clickmessage);
return false;
}
}
else if (document.getElementById){
if (e.which==3&&e.target.tagName=="IMG"){
alert(clickmessage)
return false
}
}
}
function associateimages(){
for(i=0;i<document.images.length;i++)
document.images[i].onmousedown=disableclick;
}
if (document.all)
document.onmousedown=disableclick
else if (document.getElementById)
document.onmouseup=disableclick
else if (document.layers)
associateimages()
However, when the images open in a new window, the 'no right click' function does not apply. Does anyone know how to disable the right click for the newly opened images? Many thanks! Hello guys. I've been struggling on how to make this work. I have a problem in Javascript when it comes to passing of value in a input type field. page1.html Code: <html>
<head><title></title></head>
<form action="" method="post>
<input type="text" name="weight" value=""><a href="hw_calculator.html" target="name" onclick="window.open('hw_calculator.html','name','height=270,width=370,toolbar=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes'); return false;"> calculate </a>
</form>
</html>
hw_calculator.html Code: <html>
<head>
<title>
Height Converter (Metric/Standard)
</title>
</head>
<body>
<FORM>
<INPUT type=hidden value="(Math.round((P.value * 0.45359)*100))/100" name=K_expr>
<INPUT type=hidden value="(Math.round((K.value / 0.45359)*100))/100" name=P_expr>
<INPUT type=hidden value="(Math.round((F.value * 30.48 + I.value * 2.54)*100))/100" name=C_expr>
<INPUT type=hidden value="(Math.floor(C.value / 30.48))" name=F_expr>
<INPUT type=hidden value="(Math.round(((C.value - (Math.floor(C.value / 30.48) * 30.48)) / 2.54)*100))/100" name=I_expr>
<INPUT type=hidden value="(Math.round(P.value * 0.45359))" name=K_exprrnd>
<INPUT type=hidden value="(Math.round(K.value / 0.45359))" name=P_exprrnd>
<INPUT type=hidden value="(Math.round(F.value * 30.48 + I.value * 2.54))" name=C_exprrnd>
<INPUT type=hidden value="(Math.floor(C.value / 30.48))" name=F_exprrnd>
<INPUT type=hidden value="(Math.round((C.value - (Math.floor(C.value / 30.48) * 30.48)) / 2.54))" name=I_exprrnd>
<h2>Height Converter</h2>
<table border="0" bgcolor="#FFFF99" cellspacing="6" cellpadding="6">
<tr>
<td colspan>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><b>STANDARD</b></p>
</td>
<td></td>
<td colspan>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><b>METRIC</b></p>
</td>
</tr>
<tr>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px">Feet : <input maxLength=1 size=1 value=0 name=F> Inches : <input maxLength=2 size=1 value=0 name=I>
</td>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"> = </p>
</td>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><input maxLength=3 size=1 value=0 name=C disabled> cm.</p>
</td>
</tr>
<tr>
<td class="conv" colspan="2">
<input type="button" name="Taste" value="Calculate"
onclick="if (rounded.checked == true) {
eval('C.value = ' + this.form.C_exprrnd.value);
eval('K.value = ' + this.form.K_exprrnd.value) }
else {
eval('C.value = ' + this.form.C_expr.value);
eval('K.value = ' + this.form.K_expr.value)
}">
<INPUT type=checkbox name="rounded" value="rounded" checked disabled><font size="1" face="Verdana">Rounded Result</font>
</td>
</tr>
</table>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px">
</body>
</html>
I want the value of Code: <input maxLength=3 size=1 value=0 name=C disabled> , this is from hw_calculator.html, to be passed on the Code: <input type="text" name="weight" value=""> on page1.html. How can I do this? Huge thanks. hi i was reading this but i tried it and i could not get it to work correctly. Quote: http://www.javascriptkit.com/javatutors/openclose.shtml here is what im trying to do, i installed a shout box for my users, its integrated by using session username. but what i want to do is have a username list under the shoutbox that shows which members (usernames) have the box open. that way the other members can see someone is out there to see their message.. one alternative would be to just have the shoutbox auto open (which i need to learn how to do) as soon as they sign on to the site, but what if they close it right away i still have the same issue (they cant see the message that someone is sending them) here is how i open the window now, they have to click on the link. Code: <a href="#" onClick="javascript:popup=window.open('shoutbox/minichat.php','SHTB','status=0,menubar=0,resizable=0,scrollbars=0,width=297px,height=300px');"><font size="2">Shoutbox</font></a>
so how do i know which users have it open? and how to i autostart the shoutbox? (do i used onload and onunload ??) thanks Hi All, I am not an expert in Javascript. Can I detect if 1 or more sessions of a website are open? for example, if a session with port 7005 is open like this one below, then I want to assign the next port to this user in the second window of browser http://90.97.8.0:7005/maximo/webclient/login/login.jsp the next IE window should appear like this: http://90.97.8.0:7006/maximo/webclient/login/login.jsp or http://90.97.8.0:7007/maximo/webclient/login/login.jsp Please advise. Thanks Yasar Hello, I am trying to get this sliding panel to automatically be open when the page loads. Right now it is closed and I need to click it to open. I would like for it to be automatically opened when the page first loads and click to close it. Can anyone help me with the coding? Here is the code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Demo</title> <style type="text/css"> @import url(style.css); </style> <script src="jquery.js" type="text/javascript"></script> <script src="javascript.js" type="text/javascript"></script> </head><body> <center> <div class="contenta"><img src="4.jpg" /></div> <div id="header"> <img src="2.jpg" width="938" height="68" border="0" /> </div> <div id="page_container"> <div id="toppanel"> <div style="height: 0px; display: block;" id="panel"><img src="1.jpg" width="938" height="583" /></div> <div class="panel_button" style="display: block;"><a href="#">Expand</a></div> <div class="panel_button" id="hide_button" style="display: none;"><a href="#">Close</a></div> </div> <div id="content"><img src="5.jpg" /></div> </div> </center> </body></html> and javascript.js $(document).ready(function() { $("div.panel_button").click(function(){ $("div#panel").animate({ height: "400px" }) .animate({ height: "300px" }, "fast"); $("div.panel_button").toggle(); }); $("div#hide_button").click(function(){ $("div#panel").animate({ height: "0px" }, "fast"); }); }); and css: body { text-align: center; margin: 0px; background: #000; } #page_container { position: relative; margin-left: 0px; margin-right: 0px; width: 938px; } #header { margin-left: 0px; margin-right: 0px; width: 938px; background: #111; } .panel_button { margin-left: 0px; margin-right: 0px; position: relative; top: -25px; padding-top: 5px; width: 100px; height: 22px; background: url(images/panel_button.png); z-index: 20; filter:alpha(opacity=70); -moz-opacity:0.70; -khtml-opacity: 0.70; opacity: 0.70; cursor: pointer; } .panel_button img { position: relative; top: 10px; } .panel_button a { text-decoration: none; color: #FFF; font-size: 12px; font-weight: bold; position: relative; font-family: Arial, Helvetica, sans-serif; } .panel_button a:hover { color: #999999; } #wrapper { margin-left: 0px; margin-right: 0px; width: 100%; text-align: center; } #toppanel { width: 100%; left: 0px; top: 0px; z-index: 25; text-align: center; } #panel { width: 938px; position: relative; top: 1px; height: 0px; margin-left: 0px; margin-right: 0px; z-index: 10; overflow: hidden; text-align: left; } #panel_contents { background: black; filter:alpha(opacity=70); -moz-opacity:0.70; -khtml-opacity: 0.70; opacity: 0.70; height: 100%; width: 938px; position: relative; z-index: -1; } #content { margin-left: 0px; margin-right: 0px; width: 100%; position: relative; text-align: left; color: #545454; font-family: Arial, Helvetica, sans-serif; font-size: 12px; } div.contenta { width: 938px; margin-left: 0px; margin-right: 0px; } Thank you. My question is twofold. First, is there a way to have a javascript file display an externally hosted image when opened with a browser? I mean such a way where the URL of the javascript file can be referenced by an html document and display an image? Furthermore, is there a way to have this be a different image depending on the time of day and timezone of the user, specifically one image in the morning and a different image in the evening? I apologize if I posted this in the wrong section, but I wasn't sure where else this could go. I'm making a table that is dynamically populated from XML data. One of the columns refers to an XML tag that is NOT required (hence the tag does not exist in every XML entry). How do I write a statement (if, else, or any other?) that says - check for the tag, if the tag exists, write the tag's data, if the tag does NOT exist, write "n/a". Here's the code: Thanks! [CODE] <script type="text/javascript"> if (window.XMLHttpRequest) { xhttp=new window.XMLHttpRequest(); } else // Internet Explorer 5/6 { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","http://www.mysite.com/file.xml",false); xhttp.send(""); xmlDoc=xhttp.responseXML; document.write("<table border='0' style='font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#333333; border:#333333 1px solid; text-align:center' cellpadding='5' cellspacing='0'>"); document.write("<tr><td style='border-bottom:#333333 1px solid'><strong>Type</strong></td><td style='border-bottom:#333333 1px solid'><strong>Name</strong></td><td style='border-bottom:#333333 1px solid'><strong>Details</strong></td><td style='border-bottom:#333333 1px solid'><strong>Code<br>(if applicable)</strong></td><td style='border-bottom:#333333 1px solid'><strong>Start Date</strong></td><td style='border-bottom:#333333 1px solid'><strong>End Date</strong></td></tr>"); var x=xmlDoc.getElementsByTagName("link"); for (i=0;i<x.length;i++) { document.write("<tr><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("type")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("code")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("startdate")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("enddate")[0].childNodes[0].nodeValue); document.write("</td></tr>"); } document.write("</table>"); </script> [CODE] Thanks, M8AL I'm making a table that is dynamically populated from XML data. One of the columns refers to an XML tag that is NOT required (hence the tag does not exist in every XML entry). How do I write a statement (if, else, or any other?) that says - check for the tag, if the tag exists, write the tag's data, if the tag does NOT exist, write "n/a". Here's the code: [CODE] <script type="text/javascript"> if (window.XMLHttpRequest) { xhttp=new window.XMLHttpRequest(); } else // Internet Explorer 5/6 { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","http://www.mysite.com/file.xml",false); xhttp.send(""); xmlDoc=xhttp.responseXML; document.write("<table border='0' style='font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#333333; border:#333333 1px solid; text-align:center' cellpadding='5' cellspacing='0'>"); document.write("<tr><td style='border-bottom:#333333 1px solid'><strong>Type</strong></td><td style='border-bottom:#333333 1px solid'><strong>Name</strong></td><td style='border-bottom:#333333 1px solid'><strong>Details</strong></td><td style='border-bottom:#333333 1px solid'><strong>Code<br>(if applicable)</strong></td><td style='border-bottom:#333333 1px solid'><strong>Start Date</strong></td><td style='border-bottom:#333333 1px solid'><strong>End Date</strong></td></tr>"); var x=xmlDoc.getElementsByTagName("link"); for (i=0;i<x.length;i++) { document.write("<tr><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("type")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("code")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("startdate")[0].childNodes[0].nodeValue); document.write("</td><td style='border-bottom:#333333 1px solid'>"); document.write(x[i].getElementsByTagName("enddate")[0].childNodes[0].nodeValue); document.write("</td></tr>"); } document.write("</table>"); </script> [CODE] Thanks, M8AL Hey I was just wondering how I could do this... I currently have this Code: <span id="span_1">Title</span> What I want to know is if the span is something like 240px in width how can I make it so if the text inside the span tag is to long and puts the text onto a second line how can i make a cut off point in the text to stop the text moving to a new line and adding '...' if the text is to long?? I am just starting out using Javascript and created a simple knowledge check to give a learner feedback on a question. It will allow the learner to quickly check if they have mastered a topic. The problem that I am having is that if I put two of these knowledge checks on the same webpage than it just posts the same answer when the submit button is clicked. What I have been doing is just pasting the code below twice on the page and changing the question and answer out. When I click "Check Answer" it is the same answer for both questions. Here is my code: Code: <fieldset>
<legend><strong>Question 1</strong></legend>
<SCRIPT LANGUAGE="JavaScript">
function readText (form) {
TestVar =form.inputbox.value;
alert ("You typed: " + TestVar);
}
function writeText (form) {
form.inputbox.value = "The wavelength of the blue light scatters better than the rest, predominates over the other colors in the light spectrum, and makes the sky appear blue to us."
}
</SCRIPT>
<form name="myform" action="" method="GET">
<label for="question">Why is the Sky Blue?</label><br><br>
<input name="inputbox" value="" type="text" style="width: 287px; height: 112px">
<p>
<input id="question" value="Check Answer" onclick="writeText(this.form)" type="button">
</p>
</form>
</fieldset>
Any help would be much appreciated in terms of direction. Thank you. I'm trying to develop a simple script that opens a link in a new window when the link has rel="external" set. What I don't want is to add onclick="newWindow();" to the anchor tag itself. Every example I'm finding though adds the onclick method to the HTML. Code: window.onload = newWindow();
function newWindow() {
var anchors = document.getElementsByTagName("a");
for(var i = 0; i < anchors.length; i++) {
if(anchors[i].rel == "external") {
anchors[i].onclick = function () { return window.open(this); };
}
}
}
Code: <a href="http://www.google.com/" rel="external">Click to open in new window</a> If anyone could help me or point me in the right direction, I'd greatly appreciateit. Hi EveryBody, I want to add a preview of html page feature in my project. I had created registration form and I need when user click submit button,user should get a preview of registration form after that further operation will b performed. Guys just tell me how can i achieved this. Any clue or sample code so i can learn it and implement in my project. Hi guys, I have been working on this and cant figure it out. I have an index.html as my main file and I wanted to have a pop-up window that will also open together with the index file. the pop-up window is a notepad like type, file name is clipboard.html. Addon: i started adding code to have the pop-up to stay on the right side of the screen and always on top. As of right now, all codes are very confusing and i decided to delete and start from scratch. Can you guys fill in the blanks? hi I am making a multimedia Cd presentation in Html and I was wondering if there is any way for the index.html to autorun not in a browser, but only in window without any buttons - like a popup widow ? I really need help, i am looking for solution for 3 days now, and I need this to be done tomorrow.. thanx <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script language="Javascript" type="text/javascript"> function user_prompt() { alert.("Hello there"); } user_prompt(); </script> </head> <body> </body> </html> I am such a noob. But I am so bad I cannot even get a window alert to pop up. All I want to do is call the function in the body. But do not know how... I'm writing a small browser-side Javascript that parses XML from a file and modifies it using E4X. I need to get the result to an xml text file without making the user go through a dozen hoops. Since making a JS client do file I/O is nearly impossible I gave up on that. My next idea was to make Firefox open a new window of contentType text/xml, with my serialized xml in it: Code: var xmlDoc = new XML(SourceXMLString); //SourceXMLString is read from an xml text file
output = window.open("");
output.document.open("text/xml");
output.document.write(xmlDoc.toXMLString());
output.document.close();
However any document.write instance seems to set the contentType to text/html and so all the tags are rendered wrong, naturally. From https://bugzilla.mozilla.org/show_bug.cgi?id=73409 it seems that document.open creates the right contentType, but document.write messes it up. Note: this is for a specific internal project, not the public internet. Therefore it only needs to work in Mozilla 3+, and also server-side is not an option. I'm totally open to other suggestions. What's the most streamlined/easiest way, for the code and the user, to get from that XML construct to an .xml file? This is what I have so far which prompts the user three numbers and then displays the max of the numbers and all three of them. Now the last thing I was wanting to do is change it from three prompts to just one prompt. How could I prompt to type in three numbers in one prompt and get the max from those three numbers.? Any help would be greatly appreciated. Thank you in advance! Code: <head>
<title>Maximum Number</title>
</head>
<body>
<center><h2>Maximum Number</h2>
<script language="Javascript" type="text/javascript">
function Max(num1, num2,num3)
{
var largest=arguments[num1, num2, num3]
for (i=0; i<arguments.length; i++)
{
if ((num1>num2)&&(num1>num3))
largest=num1
else if((num2>num1)&&(num2>num3))
largest=num2
else
largest=num3
}
return(largest)
}
document.write("</br>")
var num1=prompt("Enter the first number: ", "")
var num2=prompt("Enter the second number: ", "")
var num3=prompt("Enter the third number: ", "")
var max= Max(num1, num2, num3)
document.write("You entered: ", num1, ", ", num2, ", ", num3)
document.write("</br>")
document.write("The Maximum number is: ", max)
</script></center>
</body>
</html>
|
|||||||