|
JavaScript - Display Html In Javascript
I'm trying to display the elements in an array but doesn't seem to work:
Code: var myurl=new Array("google.com", "yahoo.com");
for (i=0;i<=myurl.length-1;i++){
document.writeln("<a href='http://www.' + myurl[i] + target='_blank'>");
}
Not sure why it is not working?? Similar TutorialsI have a javascript file and a html file. On the html file I have an action (button) and would like to use some type of attribute of the onclick to call my function to open this html file. below is the beginning of my function: requestPanel_Forwardme: function() { view.opendialog("show_me") What other attributes of action can I use? can this function in my JS file be called and if so how would I call it? <action?? hi this is santosh first off all thanks in advance to all who r reading my question im in prblm in my project in 1 file i have to first display textbox in html statically which will hav + & - button preceding it , & on click of + button one more textbox should appear dynamically & first textbox + button should disapper & it should hav only - button & the textbox which was dynamically generated now on click of first textbox + button should hav + & - button & it should go on. & on click of - button textbox which is in front of it should get deleted. here i tried alot but my code is showing + & - button to every textbox that is dynamically generated which is not the requirement plz help me im in great need. earlier also i hav submitted my queries & got a fully satisfied result bcoz of that now im having great hopes from u & this site plz reply as early as possible waiting for ur reply again thanks in advance Hi guys! I have a simple JavaScript stopwatch that displays the time using an html form with start/reset and clear buttons. Basically I'm making a speed calculator that converts seconds into MPH. All I need it to do is divide whatever the amount of seconds are by 40.91. So instead of it displaying the seconds being counted up (i.e. 2 seconds, would displayed as 20.455 MPH). Does that make sense? JavaScript is not my strong suit, and It's got me stumped. JavaScript: Code: var t=[0, 0, 0, 0, 0, 0, 0, 1];
function ss()
{
t[t[2]]=(new Date()).valueOf();
t[2]=1-t[2];
if (0==t[2])
{
clearInterval(t[4]);
t[3]+=t[1]-t[0];
t[4]=t[1]=t[0]=0;
disp();
}
else
{
t[4]=setInterval(disp, 43);
}
}
function r()
{
if (t[2]) ss();
t[4]=t[3]=t[2]=t[1]=t[0]=0;
disp();
t[7]=1;
}
function disp()
{
if (t[2]) t[1]=(new Date()).valueOf();
t[6].value=format(t[3]+t[1]-t[0]);
}
function format(ms)
{
var d=new Date(ms+t[5]).toString()
.replace(/.*([0-9][0-9]:[0-9][0-9]:[0-9][0-9]).*/, '$1');
var x=String(ms%1000);
while (x.length<3) x='0'+x;
d+='.'+x;
return d;
}
function load()
{
t[5]=new Date(1970, 1, 1, 0, 0, 0, 0).valueOf();
t[6]=document.getElementById('disp');
disp();
}
HTML form: Code: <input type='text' id='disp' maxlength=12 readonly /> <button type='button' onclick='ss()' id='butt' data-inline="true">Start/Stop</button> <button type='button' onclick='r()' id='butt2' data-inline="true">Reset</button> Any help is greatly appreciated!!! favorite I'd like to modify a form on www.formsite.com (form builder app): username: testuser password: password I would like to use the nicedit.com's inline content editor's js to transform my textarea's into a richtext area. At present the nicedit editor works well in creating the richtextarea. However, the KEY point is that I would like formsite's form to pipe in the the created html and render it with the html component of formsite. Currently, the pipe function in formsite will only put out the html syntax in it's html module. action seen he http://fs8.formsite.com/testform/form1/index.html So this would be: 1. checking out my form on formsite.com 2. the script from nicedit.com is already installed in an html component. 3. changing or telling me the scripts/tags/or whatever for formsite form using formsites form builder (which allows some html/script editing). 4. changed so as to render the rich text entered on page 1 in page 2 instead of the html syntax. Any other solutions using formsite and any other richtextarea solutions would be great too! Hi guys I'm really stumped on this, and I haven't been able to find a tutorial online anywhere. I'm trying to create an XML news feed for a company's website I am currently building. I have created the XML, and gotten the text to display perfectly in the HTML by using javascript. Now I want to add a thumbnail image for each news story, to make updating simpler, I wanted the url for the thumbnail to be entered into the XML, from which the javascript could read and then display in the corresponding area in the HTML. Is this even possible? Every tutorial I get when I use the terms "Image" and "Javascript" gives me a tutorial for a gallery or a slideshow which is not what I want at all. Below is the javascript code, followed by the XML code; Code: <script type="text/javascript">
var xmlDoc;
<!--
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else // Internet Explorer 5/6
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET","SDS.xml",false);
xhttp.send("");
xmlDoc=xhttp.responseXML;
var x=xmlDoc.getElementsByTagName("NEWS");
i=0;
function display()
{
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue.fontsize("5").fontcolor("white").bold());
date=(x[i].getElementsByTagName("DATE")[0].childNodes[0].nodeValue.fontsize("2").fontcolor("white").bold());
stitle=(x[i].getElementsByTagName("STITLE")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white").italics());
story=(x[i].getElementsByTagName("STORY")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white"));
txt= title + "<br />" + date + "<br />" + stitle + "<br />" + story;
document.getElementById("show").innerHTML=txt;
}
//-->
</script>
XML code Code: <?xml version="1.0" encoding="ISO-8859-1"?> <BULLETIN> <NEWS> <PIC>"/newssmall.jpg"</PIC> <DATE>14/3/2010</DATE> <TITLE>News Story 1</TITLE> <STITLE>This is a short sentence to describe the story in brief</STITLE> <STORY>This is the text of the news story</STORY> </NEWS> </BULLETIN> Thanks to anyone that even reads this, I'm probably making a nooby mistake, I only started using JS and XML on Monday so I'm still learning lol how can I display the same Javascript Graph more then once on the same HTML page. Everytime I add another graph using the same code on the same HTML page only one graph will show. Here is the code that I have: <html> <head> <title>Graph</title> <body> <title>Data</title> <p align="center"> </p> <p align="center"><font size="4"><b>test</b></font></p> <center> <script type="text/javascript" src=".\JavaFiles\wz_jsgraphics.js"> </script> <script type="text/javascript" src=".\JavaFiles\line.js"> </script> <div id="lineCanvas" style="overflow: auto; position:center;height:300px;width:800px;"></div> <script type="text/javascript"> var g = new line_graph(); g.add(' 1.0',197); g.add(' 2.0',721); g.add(' 3.0',852); g.render("lineCanvas","test"); </script> <p align="left"><font size="2"><b>Test </b></font></p> </body> What can I do to fix that. Thanks This must be very simple. I want to execute some javascript only if an element is not displayed What is the syntax? if("#element:hidden) { do something like show it } Help much appreciated. Hello, First, I'm new to the Javascript (and to this forum). I am trying to use a Javascript to display a randomly selected image located in a folder of my site. I need to fit these images (which may have quite diverse dimensions) into a frame of 280x280 px. Here is the code of the current script which does not currently work: Code: // JavaScript Document
<script language="JavaScript"><!--
function random_imglink(){
var myimages=new Array()
var imagetitle=new Array()
urlimage="http://www.mysite.fr/Images/RandomPictures/"
var i=0
//specify here the total number of random images which should be names 1.jpg, 2.jpg etc
nbrandompic=140
for (i=0;i<= nbrandompic;i++)
{
myimages[i]=urlimage + i +".jpg"
imagetitle[i]=urlimage + i +".txt"
}
//Randomly select an image
var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
var reduction = 1
var maxWidth=280
var maxHeight=280
//Calculate the reduction that should be applied
if(myimages[ry].width > maxWidth || image.height > maxHeight)
reduction = Math.max(myimages[ry].width/maxWidth,myimages[ry].height/maxHeight)
// New dimensions
iw = Math.round(myimages[ry].width / reduction)
ih = Math.round(myimages[ry].height / reduction)
//Display image
document.write('<a><img src="'myimages[ry]'" title="" border=0 width='+iw+' height='+ih+'></a>')
}
random_imglink()
//-->
</script>
I am sure that you guys can help me solve this problem. Many thanks in advance!! Antonino Doing some forum searching, I found the following code: Code: <div id="someThing" style="display:block" >Put something here.</div>
<script type="text/javascript">
var nowUrl = location.href;
if (nowUrl != "http://jemmakidd.com/categories.php") {
document.getElementById("someThing").style.display="none";
}
</script>
Apparently, this is for use of when you are modifying, for example, a PHP header or footer displayed on every page and you only want something to show up on particular pages. My issue is that I am trying to put something in the header of a Tumblr blog, and I only want it to show on the post pages. The Tumblr main page format is: http://*.tumblr.com/ The Tumblr post page format is: http://*.tumblr.com/post/* Is there any code I can use to do this? Hi guys, I am new to this forum and I am sorry if this is not the right section to post this. Please move this to the appropriate section. I am rather new to HTML and Javascripting and am currently developing an Intranet Webpage. On one of the pages, I am required to update the contents of the webpage using a .csv file which will be uploaded to the server on a daily basis. I have learnt that it is possible to update the contents using "Tabular Data Control" to display the contents and update it regularly. I am also reuqired to change an images according to content in the table. However, I am only able to retrieve the first row the the table and therefore would like some assistance to help retrieve the subsequent rows. Here are my codes: Codes for the .csv/.txt files Code: Name,Status Item #1,Completed Item #2,Pending Item #3,Not Started Item #4,Completed Item #5,Completed Item #6,Pending HTML codes: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body onLoad="loadStatus()">
<script type="text/javascript">
function loadStatus(){
var textField = document.getElementById("test").innerText
alert(textField);
if(textField == "Completed") {
document.getElementById("pic").src = '/images/completed.jpg'; }
else if (textField == "Pending") {
document.getElementById("pic").src = '/images/on-going.jpg'; }
else if (textField == "Not Started") {
document.getElementById("pic").src = '/images/not_started.jpg'; }
}
</script>
<OBJECT ID="data" CLASSID="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83">
<PARAM NAME="DataURL" VALUE="test.txt">
<PARAM NAME="UseHeader" VALUE="true">
</OBJECT>
<table border="1" bordercolor="#000000" cellpadding="0" datasrc="#data" >
<THEAD><TR>
<TBODY>
<TR>
<TD><img src="" width="14" height="14" id="pic"></TD>
<TD><div datafld="Name"></div></TD>
<TD id="test"><span datafld="Status"></span></TD></TR>
</TBODY>
</TABLE>
</body>
</html>
I have thought of adding 6 different <object> and 6 <span> using filter to filter each object according to their name. But it would be very messy and would make the page bigger in size. I hope you guys can help me. Thanks in advance. Cheers, Jermms Hello, I have an issue. I can't seem to extract XML from an somepage.xml document and display it on a regular webpage. I have no way of reading its contents. I read up on some microsoft way of doing it, but not sure that is gonna fly (need it for most browsers), so can this be done easily with json/ajax? I have an xml file in normal format: www.somedomain.com/somepath/somexml.xml <products> <items> <item>blah</item> <item>blah2</item> <item>blah3</item> <item>blah4</item> <item>blah5</item> </items> </products> So, how do I get that data to manipulate and display in my html? I don't even know where to begin with json/ajx etc.. and how to call the xml file etc.. I'm not that familiar with classic ASP or Javascript but need to change an exisiting program to do the following: Add a link to a page but only for certain marketers. I have a classic ASP page that has a couple of hyperlinks for each marketer that is selected from a combobox drop down. The new hyperlink is to be added but only for select marketers. The rest don't even get to see this new hyperlink. I added a function in Javascript as such: Code: function IsPikeESCO(UID,UCD)
{
var strTemp;
var mktrno,mktname;
var frm;
var IsPike;
IsPike = false;
frm = document.Downloads;
strTemp=frm.MKTRACCT.options[frm.MKTRACCT.selectedIndex].text;
mktrno=strTemp.substring(0,10);
switch (mktrno)
{
case 8:
IsPike = True;
break;
case 99:
IsPike = True;
break;
case 162:
IsPike = True;
break;
}
return IsPike;
}
Now I need to check if True then display the hyperlink, so I came up with this, which I know is not correct: Code: <tr><td></td><td
<%IF <a HREF="javascript:IsPikeESCO('<%response.write request("passUID")%>','<%response.write request("passUCD")%>')" = True THEN%>
onMouseOver="/orradata/pike.DAT">Pike Data</font></a>
<%END IF%>
I want to be able to check the fuction for each marketer and if return is TRUE, then produce the hyperlink which will open a data file if clicked. Can someone help? I'm not sure how to use the <%IF statement in conjunction with a javascript function that checks for a return value, and based on that return value, does some action. This is a follow up to my older thread, about tables and finding images within them. So after getting some help from "Krupski" I found myself stuck again. I'm trying to go at this rather from an other point of view, instead of getting the cell information I am now trying to get the alt text value. from within the image tag. but being a novice at this well ive hit a wall. My code so far. searches though the table finding the sad images then i want it to display the Alt-text or an other value table_id or similar. also is there a fast way of putting in Alt text like A1,2,3 B1,2,3 etc like an automated loop. (might work on this after the main problem is dealt with) Code: <html>
<head>
<script type="text/javascript">
var findImg = function(name) {
var e = document.getElementsByTagName('img');
var i = e.length; // how many img elements total
var str = '';
while (i--) {
if (e[i].src.indexOf(name) != -1) // if match...
str += e[i].src + '\n'; //...copy to str with a newline
}
alert(str); // display all matches
}
function searchFor(){
findImg('smiley%20sad%20Icon.jpg'); // call the function with the name to be matched
}
</script>
</head>
<body>
<table width="200" border="1">
<tr Id="A">
<td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="A1"> </td>
<td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="A2"> </td>
<td Id="3"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg" Alt="A3"></td>
</tr>
<tr Id="B">
<td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="B1"></td>
<td Id="2"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg" Alt="B2"></td>
<td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="B3"></td>
</tr>
<tr Id="C">
<td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C1"></td>
<td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C2"></td>
<td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C3"></td>
</tr>
</table>
<br>
<input type="button" value="Search" id="Search" onClick="searchFor();"/>
</body>
</html>
Thanks in advance anyone who can help. ~Mark j I have an xml file: http://greenandtheblue.com/weather/parks.xml I'd like to display on an html page the time this xml document was last modified. I've done this successfully with php, but I'm wondering if I can do this with Javascript? The file will be in the same directory as the website/html page. I've googled for a while now with no success. Thanks for any help, S New to this, worked through the w3c tutorials and am really fascinated by some of the concepts. I'm only familiar with html, css, js (basics), so am trying to keep things as simple as I can for this. For simplicity I'll use books.xml with a listing of books. Each book has a <title><author><year><price> and <image> element. The images are stored in a folder called "images" a path is listed in the xml document. Using js and an array I can loop through the xml file and have it extract each node into a table, if I mouseOver a ROW in the table, it displays that listing in a DIV above and I would like it to display the image/thumbnail for that particular listing within another div called thumbnail which is in the same location regardless of which listing you mouseOver. Quote: if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","books.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; x=xmlDoc.getElementsByTagName("book"); i=0; function displayBook(i) { title=(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue); author=(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue); year=(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue); price=(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue); genre=(x[i].getElementsByTagName("genre")[0].childNodes[0].nodeValue); txt="Author: "+author+"<br />Title: "+title+ "<br />Year: "+year+"<br />Price: "+price + "<br />Category: " +genre; document.getElementById("showBook").innerHTML=txt; } Quote: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <script type="text/javascript" src="myscript.js"></script> <link rel="stylesheet" type="text/css" href="stylin.css" /> </head> <body onload="displayBook(0)"> <div id="wrap" width="40%"> <div id="desc">Listing: </div> <div id='showBook'></div><br /> <div id="thumbnail">thumbnail <script type="text/javascript"> document.write(????????????????); </script></div> <script type="text/javascript"> document.write("<table border='1'; >"); document.write("<caption>Mouse over a cell to view description:</caption"); document.write("<tr><td class=top>Book Title</td><td class=top>Category</td><td class=top>Cost: </td></tr>"); for (var i=0;i<x.length;i++) { document.write("<tr onMouseOver='displayBook(" + i + ")'; >"); document.write("<td>"); document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write("</td><td>"); document.write(x[i].getElementsByTagName("genre")[0].childNodes[0].nodeValue); document.write("</td><td>" + "$"); document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue ); document.write("</td><td>"); document.write(x[i].getElementsByTagName("image")[0].childNodes[0].nodeValue ); document.write("</td></tr>"); } document.write("</table>"); </script></div></div> </body> </html> So the way this looks is there's a grey div. At the top it says listing, and when the body loads it lists the [0] first entry from the array. To the right of this is a small div called thumbnail that is empty and I would like it to load the relevant image from the path in the <image> tag in the xml file. Below the listing is a table with 4 columns (title, genre, price, image) and an equal number of rows to the number of listings in the xml file. Under the "image" column it just shows the path to the image. So how do I tie the empty thumbnail div to the listing so it'll just add the path from the xml <image> tag into a <img src="pathnamefromxmldocument"> Thanks in advance! Hi. Can someone tell me if it is possible to display the duration a webpage is accesssed. For example, if its a form webpage, then the time to be displayed will be = time the webpage was left (press submit button etc. or the time the viewer left the page) - time the webpage was first accessed or loaded. If it is possible with javascript, what are the methods, attributes etc that need to be used. Very naive coding question... i'm a novice coder and i think javascript is the solution i need but - maybe there's better ways... Ok - my website accepts a login password to access certain pages. Depending on the password entered i set a javascript variable to either 'true' or 'false'. If the variable is set to 'true' then i want to give the user access to shopping cart buttons, if 'false' then the shopping cart buttons should be hidden. My current solution is to wrap javascript around each shopping cart button and display only if the variable is set to 'true'. The shopping cart button looks a bit like this: Code: <form method="post" action="http://www.shoppingcart.com"> <input type="hidden" name="product" value="product" /> <input type="hidden" name="price" value="9.99" /> <input type="hidden" name="return" value="http://www.home.com"/> <input type="submit" value="add to basket" /> </form> I've tried displaying this using document.write() - but it gets confused when it encounters the ":" in the web address. Also i get the impression from trawling the forums that document.write is not flavour of the month these days. And another thought - I accept the variable on one page - then move to multiple other pages to reference it.... will the variable still be there when i move to other pages or do i need to somehow pass it across each time? Trying to keep my coding XHTML compliant... Any pointers and idiot proof suggestions would be much appreciated. Hey, I'm looking for different JS form validation techniques. I've seen quite a few but nothing that really stands out. I'm particularly interested in finding design techniques...ie: how and where are the errors displayed inside a form? I realize that I can't count on JS for validation, but I'm trying to add an assistive technology to make a web form feel more like a web application. I'd love to see your favorite way of displaying form errors via JS. I've got a few of my own but if you've ever tried to do this you know it's a difficult problem to handle the general case. Thanks! hi, im fairly new to javascript but i know the basics. im just wondering is there a possibility to make a search that will connect to my databse with a product list in it, and then display any matches to what the user searched for? help is always helpful Hello, I am new to JavaScript. I have stuck up at a point. I have generated a table of given dimensions (say 5x5) using JavaScript. Using Mouse events, I want to add a functionality which would display the position of the cell in that table whenever mouse pointer hovers over a particular cell. Here's what I have done. Code: <html>
<body>
<h1 align="center"><u>ITA Tutorial</u></h1>
<h3>Problem Statement</h3>
<p>Prepare the table of 5 X 5. On the cursor movement over the table, display the table cell no with row X column value.</p>
<br><br>
<table border="1" align="center" cellpadding="2">
<script type="text/JavaScript">
var i, j
for (i=1;i<6;i++)
{
document.write("<TR>")
for(j=1;j<6;j++)
document.write("<TD> </TD>")
document.write("</TR>")
}
</script>
</table>
</body>
</html>
I tried adding onMouseover event in the <TD> tag but somehow the whole table disappears when I do that. Please help. |
|||||||