|
JavaScript - Getelementbyid Not Working
http://johnathany.com/contact.html
What I'm trying to do is get the googlemaps iframe to change if i hit to corresponding 3 links at the bottom. So I tried to use getElementById(leftcolumn).innerhtml to change the entire content of the div but it isnt working. Please advise. Or would there be a simpler solution like creating 3 hidden divs and just do display:block; to display them? Similar Tutorialswhy is getElementById not working?? pls try it and tell me if you get a hit on document.getElementById("t1"); thanks Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Tester code</title>
<script type="text/javascript">
console.log("sfsg");
var e = document.getElementById("t1");
var c = e.firstChild;
console.log(c);
</script>
</head>
<body>
<table>
<tr>
<td id="t1"><img id="img1" src="SharkSq1.png">3</td>
</tr>
</table>
</body>
</html>
Hi. I'm making a web site...And the following bit of code doesn't work...It sais "document.getElementById(...) is null or not an object"...I tried various combinations of getElementById and getElementsByName but nothing works...Any help is very much appreciated. Thanks. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Rudolf-site management</title>
<script language="javascript">
<!--
function Val_imag(){
if(document.site.Imagini[0].checked){
for(var i=0; i<16; i++){
document.getElementById('Fs_img')[i].style.display='none'
document.getElementById('Txt_img')[i].style.display='none'}}
else{
if(document.site.Imagini[1].checked){
for(var i=0; i<16; i++){
document.getElementById('Txt_img')[i].style.display='none'}
document.getElementById('Fs_img0').style.display=''}
else{
if(document.site.Imagini[2].checked){
for(var i=0; i<16; i++){
document.getElementById('Fs_img')[i].style.display='none'}
document.getElementById('Txt_img0').style.display=''}
else{
for(var i=0; i<16; i++){
document.getElementById('Fs_img')[i].style.display='none'
document.getElementById('Txt_img')[i].style.display='none'}}}}}
function Cont_pag3(){
if(document.site.Imagini[0].checked){
document.site.pag3_5.disabled=false}
else{
if(document.site.Imagini[1].checked){
if(document.site.Fis_img[0].value!=""){
document.site.pag3_5.disabled=false}
else{
document.site.pag3_5.disabled=true}}
else{
if(document.site.Imagini[2].checked){
if(document.site.Text_img[0].value.length>7){
document.site.pag3_5.disabled=false}
else{
document.site.pag3_5.disabled=true}}}}}
// -->
</script>
</head>
<body bgcolor=#000437>
<font color=#FDB91A>
<form method="post" name="site" action="site.php" enctype="multipart/form-data">
<div id="pagina3" class="comanda">
Pasul III: Imagini<br/>
Pentru a trimite imaginile care vor aparea pe site (daca exista), aveti 2 optiuni: sa ne trimiteti un fisier .zip, .rar, etc sau sa scrieti un link unde le vom putea gasi.<br/><br/>
Le puteti organiza cum doriti dumneavostra, dar este preferabil sa folositi una dintre variantele urmatoa <br/><br/>
(folder) pagina 1: (folder) pagina 1-1: imaginile care apar pe pagina 1-1<br/>
<table style="color=#FDB91A"><tr><td width="155"></td><td width="250">imaginile care apar pe pagina 1 etc</td></tr></table><br/><br/>
(folder) pagina 1: imaginile care apar pe pagina 1<br/>
(folder) pagina 1-1: imaginile care apar pe pagina 1-1 etc<br/><br/>
(folder - nu este necesar) site: toate imaginile care apar pe site<br/>
<table style="color=#FDB91A"><tr><td width="200"></td><td width="250">fisier text (.txt, .doc, .docx etc) cu numele imaginilor si pagina pe care apar</td></tr></table><br/><br/>
La toate exemplele, in loc de pagina 1 etc puteti scrie numele paginii.<br/>
Puteti adauga pana la 10 fisiere si pana la 15 link-uri. Pentru a adauga inca un fisier/link apasati pe butonul corespunzator.<br/>
Va rugam ca fisierele trimise sa fie de maximum 5 MB. (Puteti downloada si instala gratuit <a href="http://www.rarlab.com/download.htm" target="_blank">WinRar</a> si sa-l folositi pentru a face o arhiva impartita in mai multe bucati.)<br/><br/>
<input type="radio" name="Imagini" value="NuAm" onClick="Val_imag();Cont_pag3()">Site-ul nu are imagini<br/>
<input type="radio" name="Imagini" value="Fisier" onClick="Val_imag();Cont_pag3()">Trimite fisier<br/>
<table id="Fs_img0" style="display: none"><tr><td><input type="file" name="Fis_img" size="100" onChange="Cont_pag3()"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img1').style.display=''"></td></tr></table>
<table id="Fs_img1" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img2').style.display=''"></td></tr></table>
<table id="Fs_img2" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img3').style.display=''"></td></tr></table>
<table id="Fs_img3" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img4').style.display=''"></td></tr></table>
<table id="Fs_img4" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img5').style.display=''"></td></tr></table>
<table id="Fs_img5" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img6').style.display=''"></td></tr></table>
<table id="Fs_img6" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img7').style.display=''"></td></tr></table>
<table id="Fs_img7" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img8').style.display=''"></td></tr></table>
<table id="Fs_img8" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img9').style.display=''"></td></tr></table>
<table id="Fs_img9" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img10').style.display=''"></td></tr></table>
<table id="Fs_img10" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img11').style.display=''"></td></tr></table>
<table id="Fs_img11" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img12').style.display=''"></td></tr></table>
<table id="Fs_img12" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img13').style.display=''"></td></tr></table>
<table id="Fs_img13" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img14').style.display=''"></td></tr></table>
<table id="Fs_img14" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td><td width="30"></td><td><input type="button" name="Add_img_fis" value="Adauga fisier" onClick="document.getElementById('Fs_img15').style.display=''"></td></tr></table>
<table id="Fs_img15" style="display: none"><tr><td><input type="file" name="Fis_img" size="100"></td></tr></table>
<input type="radio" name="Imagini" value="Text" onClick="Val_imag();Cont_pag3()">Scrie/copiaza link-ul<br/>
<table id="Txt_img0" style="display: none"><tr><td><input type="text" name="Text_img" size="80" onKeyUp="Cont_pag3()"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img1').style.display=''"></td></tr></table>
<table id="Txt_img1" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img2').style.display=''"></td></tr></table>
<table id="Txt_img2" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img3').style.display=''"></td></tr></table>
<table id="Txt_img3" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img4').style.display=''"></td></tr></table>
<table id="Txt_img4" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img5').style.display=''"></td></tr></table>
<table id="Txt_img5" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img6').style.display=''"></td></tr></table>
<table id="Txt_img6" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img7').style.display=''"></td></tr></table>
<table id="Txt_img7" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img8').style.display=''"></td></tr></table>
<table id="Txt_img8" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img9').style.display=''"></td></tr></table>
<table id="Txt_img9" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img10').style.display=''"></td></tr></table>
<table id="Txt_img10" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img11').style.display=''"></td></tr></table>
<table id="Txt_img11" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img12').style.display=''"></td></tr></table>
<table id="Txt_img12" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img13').style.display=''"></td></tr></table>
<table id="Txt_img13" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img14').style.display=''"></td></tr></table>
<table id="Txt_img14" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td><td width="30"></td><td><input type="button" name="Add_img_txt" value="Adauga link" onClick="document.getElementById('Txt_img15').style.display=''"></td></tr></table>
<table id="Txt_img15" style="display: none"><tr><td><input type="text" name="Text_img" size="80"></td></tr></table><br/>
Observatii:<br/>
Daca aveti observatii/idei legate de imagini (amplasare, contur, text etc), le puteti scrie aici.<br/>
Nu este un camp obligatoriu.<br/>
<textarea name="Obs_img" cols="80" rows="7"></textarea><br/><br/><br/><br/>
<input type="button" name="pag2_1" value="Pagina precedenta">    
<input type="button" name="pag3_5" value="Continua comanda" disabled=true>
</div>
PS1: this code worked in firefox PS2: sorry for posting such a long code... I have some simple javascript code that works fine in chrome and safari, but not Ie8 Code: <head><script type="text/javascript">
function val2() {
//var num = Number(document.getElementById('PdRows').value)
alert (document.getElementById('PdRows').value)
}
</script></head>
<form action="" method="post">
<select name="PD" id="PdRows" onchange="val2()">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</form>
Why? And how do I correct? Hello all, I am trying to use document.getElementById in FF but its not working. There is a main page. in that mainpage there is a iframe and in that iframe (id = DocFrame) there is a textbox (id="fileuploadedcnt") which i am trying to access. there is no error. ofcourse i have given name and id to the textbox. Below is the code function ConfirmCertificate(id , Project_ID , Subprogram_ID , ITCType_TI) { frm=document.mainform; //fileuploadedcnt = (document.frames("DocFrame").document.forms("upload_form").elements("fileuploadedcnt").value); filecntobj = (document.getElementsByName("fileuploadedcnt")); filecntobj = (document.getElementById("fileuploadedcnt")); alert(fileuploadedcnt); alert((filecntobj.value)); return; if (fileuploadedcnt>0) { result=confirm("Are you sure you want to confirm this certificate? "); } In the abpve case i tried both the name and id properties. with Name property i get the HTMLObj alert but again it fails if i attach value method. And for id, it doesnt work at all No errors ofcourse in both the cases What am i missing Thanks This code works fine in IE but it won't in FF. The error console says topdiv.style and sidediv.style are 'undefined' This is the javascript: Code: function changeposition() {
topdiv = "document.getElementById('top')";
sidediv = "document.getElementById('side')";
if (document.scrolltop > 100) {
topdiv.style.position = "fixed";
topdiv.style.top = "-100px";
sidediv.style.position = "fixed";
sidediv.style.position = "35px";
} else {
topdiv.style.position = "absolute";
topdiv.style.top = "0px";
sidediv.style.position = "absolute";
sidediv.style.position = "135px";
}}
window.onscroll = changeposition();
and the HTML: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="stylesheet" type="text/css" href="standardstyle.css"> <script type="text/javascript" src="menuposition.js"></script> </head> <body> <div class="top" id="top"> ... </div> <div class="sidebar" id="side"> ... </div> ... </body> </html> I'm using FF4 Hi ALL, I am validating a three form field which takes temperature value between 0-50, humidity 1-100 & rainfall 0-200. I am able to see expected result for temperature value but not getting correct value for humidity & rainfall(still one can insert text in it..) Here is my code-: Code: <script type="text/javascript">
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(obdate,"Date must be filled out!")==false)
{
obdate.focus();return false;}
}
is_leaf_fresh = -1;
for (i=0;i < thisform.is_leaf_fresh.length; i++)
{
if (thisform.is_leaf_fresh[i].checked == true)
{
//alert("coming into "+thisform.is_leaf_fresh[i].checked);
is_leaf_fresh = 1;
}
}
if ((is_leaf_fresh == -1))
{
alert("You must select an option for Fresh Leaf!");
return false;
}
var temp_max;
temp_max = document.getElementById("temperature_max").value;
if (temp_max != '' )
{
var numericExpression = /^[0-9]+$/;
if(temp_max.match(numericExpression) && (temp_max>=0 && temp_max<=50)){
return true;
}
else{
alert("Max Temperature value should be Numeric & between 0 to 50");
document.getElementById("temperature_max").focus();
return false;
}
}
var temp_min;
temp_min = document.getElementById("temperature_min").value;
if (temp_min != '' )
{
var numericExpression = /^[0-9]+$/;
if(temp_min.match(numericExpression) && (temp_min>=0 && temp_min<=50)){
return true;
}
else{
alert("Min Temperature value should be Numeric & between 0 to 50!");
document.getElementById("temperature_min").focus();
return false;
}
}
var rainfall_mm;
rainfall_mm = document.getElementById("rainfall_mm").value;
if (rainfall_mm != '' )
{
var numericExpression = /^[0-9]+$/;
if(rainfall_mm.match(numericExpression) && (rainfall_mm>=20 && rainfall_mm<=50)){
return true;
}
else{
alert("Min Temperature value should be Numeric & between 20 to 50!");
document.getElementById("rainfall_mm").focus();
return false;
}
}
var humidity_mm;
humidity_mm = document.getElementById("humidity_mm").value;
if (humidity_mm != '' )
{
var numericExpression = /^[0-9]+$/;
if(humidity_mm.match(numericExpression) && (humidity_mm>=20 && humidity_mm<=50)){
return true;
}
else{
alert("Min Temperature value should be Numeric & between 20 to 50!");
document.getElementById("humidity_mm").focus();
return false;
}
}
}
</script>
Thanks in Advance!! I'm a newbie, so it may be obvious. But can someone help me here? I want to display images based on times Code: <script type="text/javascript">
/*<![[CDATA */
var time = new Date();
var dayNight = time.getHours(); // gets the time of the day in hours
function displayImage() {
if (dayNight >= 9 && dayNight <= 14) {
document.getElementById("highlights").src="http://www.kacvtv.org/rotatorpics/amergrad.jpg";
}
if (dayNight >= 14 && dayNight <= 17) {
document.getElementById("highlights").src="http://www.kacvtv.org/rotatorpics/video-contest.jpg";
}
if (dayNight >= 17 && dayNight <= 22 ) {
document.getElementById("highlights").src="http://www.kacvtv.org/rotatorpics/vine.jpg";
}
else {
document.getElementById("highlights").src"http://www.kacvtv.org/rotatorpics/amergrad.jpg";
}
}
/*]]>*/
</script>
Then the code in the body Code: <body onload="displayImage"> <div id="highlights"> </div> Here's a link. http://tinyurl.com/7bzkdk7 I'm working on my own site for layouts for sites like Myspace and Ning. Myspace changed their layouts to no longer include CSS so I am working on a new way to post their layouts. I used this same method to post all our other layouts. For some reason this is not showing up in IE. Firefox: IE: Interestingly enough, when I run the debugger in IE it loads when it is done. If not I get the black hole effect above. ERRORS: Object required Not implemented Any help will be greatly appreciated! Code: bgImg = document.getElementById('bg').innerHTML;
tile = document.getElementById('bgtile').innerHTML;
att = document.getElementById('bgatt').innerHTML;
pos = document.getElementById('bgpos').innerHTML;
top = document.getElementById('mar').innerHTML;
ht = document.getElementById('marht').innerHTML;
alink = document.getElementById('sel').innerHTML;
col = document.getElementById('bgcol').innerHTML;
hed = document.getElementById('hdr').innerHTML;
bord = document.getElementById('bdr').innerHTML;
con = document.getElementById('ct').innerHTML;
div3 = document.getElementById('MS3css').innerHTML;
if (document.getElementById('bg')){
document.getElementById('bgimgEmpty').innerHTML='Background Image: <br /><textarea id="MS3" style="width:250px; height: 55px; background: #999999; color: #000000; padding: 2px;" onclick="select()" ><img src="'+bgImg+'"></textarea><br />';}
if (document.getElementById('bgtile')){
document.getElementById('bgtileEmpty').innerHTML='Background Tile: <br /><textarea id="MS3" style="width:250px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+tile+'</textarea><br />';}
if (document.getElementById('bgatt')){
document.getElementById('bgattEmpty').innerHTML='Background Attachment: <br /><textarea id="MS3" style="width:250px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+att+'</textarea><br />';}
if (document.getElementById('bgpos')){
document.getElementById('bgposEmpty').innerHTML='Background Position: <br /><textarea id="MS3" style="width: 250px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+pos+'</textarea><br />';}
if (document.getElementById('mar')){
document.getElementById('marEmpty').innerHTML='Marquee: <br /><textarea id="MS3" style="width:250px; height: 55px; background: #999999; color: #000000; padding: 2px;"><a href="http://skemaholicsanonymous.com/"><img src="'+top+'"></a></textarea><br />';}
if (document.getElementById('marht')){
document.getElementById('marhtEmpty').innerHTML='Marquee Height: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+ht+'</textarea><br />';}
if (document.getElementById('sel')){
document.getElementById('selEmpty').innerHTML='Selected: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+alink+'</textarea><br />';}
if (document.getElementById('bgcol')){
document.getElementById('bgcolEmpty').innerHTML='Background Color: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+col+'</textarea><br />';}
if (document.getElementById('hdr')){
document.getElementById('hdrEmpty').innerHTML='Header: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+hed+'</textarea><br />';}
if (document.getElementById('bdr')){
document.getElementById('bdrEmpty').innerHTML='Borders: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+bord+'</textarea><br />';}
if (document.getElementById('ct')){
document.getElementById('ctEmpty').innerHTML='Content: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;" onclick="select()" >'+con+'</textarea><br />';}
if (document.getElementById('MS3css')){
document.getElementById('code2Empty').innerHTML='<form id="genDone"action="http://blog.skemaholicsanonymous.com/MSPreview3/preview.php" method="post" rel="nofollow" target="_blank"><textarea id="codebox" style="display: none;" name="genCode">'+div3+'</textarea><br /><input type="submit" value="Preview" id="prevLoad" /></form>';}
Having so much trouble with this entire slideshow... but this is the most recent development. For some reason the opacity change and border styles are not being added to the current thumbnail div that is selected, controlled by this code: Code: var current = 0;
function swapimg( show ){
var piece = new Array();
piece[0] = '../assets/images/windycity/windycity01.gif';
title[0] = '[ Winners Paint the Town Red. Loosers Supply the Blood. ]';
piece[1] = '../assets/images/windycity/windycity02.gif';
title[1] = '[ One way or another they’re leaving on wheels. ]';
document.getElementById( 'featured' ).src = piece[show];
document.getElementById( 'featured' ).alt = title[show];
for( i = 0; i < meta.length; i++ ){
document.getElementById( 'item' + i ).style.opacity = '.5';
document.getElementById( 'item' + i ).style.border = 'solid 2px #2b2b2d';
}
document.getElementById( 'item' + ( show ) ).style.opacity = '.99';
document.getElementById( 'item' + ( show ) ).style.border = 'solid 2px #0597af';
current = ( show );
And this is the html that it should be controlling: Code: <div class="thumbs">
<div class="listimg"><span onclick="swapimg(0);" ><img id="item0" src="../assets/images/windycity/windycity01_thumb.jpg" alt="" style="opacity: .99; border:solid 2px #0597af"/></span></div>
<div class="listimg"><span onclick="swapimg(1);" > <img id="item1" src="../assets/images/windycity/windycity02_thumb.jpg" alt="" /></span></div>
<div class="listimg"><a href="javascript:swapimg(2);" ><img id="item2" src="../assets/images/windycity/windycity03_thumb.jpg" alt="" /></a></div>
</div>
Any help would be great- I've been staring at this so long all the code has jumbled together in my head, and as soon as I tackle one problem I find another! Thanks! Hi guys, i m novice to javascript, i have a piece of code to preview the image after selecting it from file upload control,its working fine in Firefox,but its not working in IE,Chorome,what is the error please let me know,here is my code. function setImage(file) { if (document.all) document.getElementById("<%=prevImage.ClientID %>").src = file.value; else document.getElementById("<%=prevImage.ClientID %>").src = file.files.item(0).getAsDataURL(); if (document.getElementById("<%=prevImage.ClientID %>").src.length > 0) document.getElementById("<%=prevImage.ClientID %>").style.display = 'block'; } Hi, I am trying to show and hide different div objects on a webpage all with different ID's as you can see. Only the first object will work "('killstreakwin')", or any that is put first, none of the others work after that. It's not the HTML side, it's definatly the javascript function. I've tried to use a loop but I don't know how to implement it into something like this. Any help would be appreciated. This is the code I am using:- function windowOpen() { (document.getElementById('killstreakwin').style.visibility='visible'); (document.getElementById('standardwin').style.visibility='visible'); (document.getElementById('hardenedwin').style.visibility='visible'); (document.getElementById('veteranwin').style.visibility='visible'); (document.getElementById('prestigewin').style.visibility='visible'); (document.getElementById('perkswin').style.visibility='visible'); (document.getElementById('copycatwin').style.visibility='visible'); (document.getElementById('martyrdomwin').style.visibility='visible'); (document.getElementById('finalstandwin').style.visibility='visible'); (document.getElementById('painkillerwin').style.visibility='visible'); (document.getElementById('rankswin').style.visibility='visible'); (document.getElementById('prestigewin').style.visibility='visible'); (document.getElementById('primarywin').style.visibility='visible'); (document.getElementById('secondarywin').style.visibility='visible'); (document.getElementById('attachmentswin').style.visibility='visible'); } function windowClose() { (document.getElementById('killstreakwin').style.visibility='hidden'); (document.getElementById('standardwin').style.visibility='hidden'); (document.getElementById('hardenedwin').style.visibility='hidden'); (document.getElementById('veteranwin').style.visibility='hidden'); (document.getElementById('prestigewin').style.visibility='hidden'); (document.getElementById('perkswin').style.visibility='hidden'); (document.getElementById('copycatwin').style.visibility='hidden'); (document.getElementById('martyrdomwin').style.visibility='hidden'); (document.getElementById('finalstandwin').style.visibility='hidden'); (document.getElementById('painkillerwin').style.visibility='hidden'); (document.getElementById('rankswin').style.visibility='hidden'); (document.getElementById('prestigewin').style.visibility='hidden'); (document.getElementById('primarywin').style.visibility='hidden'); (document.getElementById('secondarywin').style.visibility='hidden'); (document.getElementById('attachmentswin').style.visibility='hidden'); } Hopefully some of you guys can help. I'm self taught in Javascript so only know little bits here and there (and don't even know if the thread title is labelled right for what I'm doing!) so help would be greatly appreciated. I'm trying to create 4 buttons on a page (buttons shown by "click here to view c1, c2" etc.) however after I've clicked one button and the content is showing below, the content from the next button clicked does not show (almost as if it is hidden underneath). I'm looking for a way of showing the content when the button is clicked, but hiding it once another button is clicked so other content is shown. Hopefully this is clear enough. All help, tips or advice will be appreciated. Thankyou. Code: <script type="text/javascript" language="JavaScript"><!--
function InsertContent(tid) {
if(document.getElementById(tid).style.display == "none") {
document.getElementById(tid).style.display = "";
}
else {
document.getElementById(tid).style.display = "none";
}
}
//--></script>
<table width="100%" cellspacing="4" cellpadding="4" border="0" align="center">
<tbody>
<tr>
<td width="25%"><a href="javascript:InsertContent('c1');"> Click to see C1</a></td>
<td width="25%"><a href="javascript:InsertContent('c2');"> Click to see C2</a></td>
<td width="25%"><a href="javascript:InsertContent('c3');"> Click to see C3</a></td>
<td width="25%"><a href="javascript:InsertContent('c4');"> Click to see C4</a></td>
</tr>
</tbody>
</table>
<hr />
<div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c1">CONTENT C1
</div>
<div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c2">CONTENT C2
</div>
<div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c3">CONTENT C3
</div>
<div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c4">CONTENT C3
</div>
Hello smart people... perhaps someone can figure this one out. I hope it's not a PHP question. I have a form and need to populate FIELD2 with the result of FIELD1. Field one is a dynamic list from a database, where the value is an ID#, but the list shows the name. I want to populat FIELD2 with the name that is chosen, not the id (I can't get anything to work) Here is the code from the 2 fields: FIELD 1: Code: <select name = "" realname = "{#role#}" required="1" exclude = "-1" id = "roleselect">
<option value="-1" selected="selected">Choose</option>
<option value = "{$roles[role].ID}" id="role{$roles[role].ID}">{$roles[role].name}</option>
FIELD 2: Code: <input type="hidden" name="rolename" id="rolename" required="0" realname="rolename" /> Here is the javascript I tried to populate field 2 with the selected option of field 2: Code: function updaterole(){
document.getElementById("rolename").value =document.getElementById("role").value;
I tried using name instead of value for field 1, but that didn't work either. The db just shows empty. thanks for any help! hi quick question, i have 640 hidden html inputs like this but with different names. <input type="hidden" name="b1r1c1" value"some value"> now i want to use document.getElementById('b1r1c1).value = "whatever"; will that work eventhough there is no id on my hidden value. it will be in a hta by the way. thanks hi, In my code below, I cannot get the setting_id value as it falls outside of the loop. I have just tried to put in the getElementById function but it's not working?! I get the error: missing ) after formal parameters JavaScript from this: Code: function confirmqualification(ID) {
to this: Code: function confirmqualification(document.getElementById('setting_id')) {
HTML from this: Code: <input type="button" name="remove" id="remove" value="Remove" onClick="javascript:confirmqualification('<?php echo $row1['setting_id']?>')" />
to this: Code: <input type="button" name="remove" id="remove" value="Remove" onClick="javascript:confirmqualification()" /> I am using javascript for adding and removing rows from table as per user require ment like if we press ADDROW button it adds extra row to table and if we pressREMOVEROW it delets the last row.. Now i want to access the data from textbox like this.. var crpt = document.getElementById("itrtr2").value; //no. of rows for(var k=1;k<=crpt;k++) { qtyc = document.getElementById("txtRowc3"+k).value; unit_pricec = document.getElementById("txtRowc5"+k).value; alert('QTYC:'+qtyc+' UPC:'+unit_pricec); cttl = qtyc * unit_pricec; document.getElementById("txtRowc6"+k).value = cttl.toFixed(2); csbttl = csbttl + cttl; } document.getElementById("subttlC").value=csbttl.toFixed(2); it shows the value of textRowc3i in qtyc in alert box but also givs error document.getElementById("txtRowc3"+k) is null.. I tried for this but problem is not solved please help... Thank You... Hello, Javascript newbie question. I am trying to write into <p> tags using getElementById(), instead of document.write() which I commented out but it does not work the way I put it. Thanks a lot if you can instruct me! Code: <html>
<body>
<script type="text/javascript">
var x;
var mycolors = new Array();
mycolors[0] = "blue";
mycolors[1] = "orange";
mycolors[2] = "green";
for (x=0; x<mycolors.length; x++)
{
var output = mycolors[x] + "<br />"
document.getElementById("output").innerHTML=output; //instead of document.write(output);
}
</script>
<p id="output"></>
</body>
</html>
i am trying to pass the Id of a text field so I can validate it. At this point all I want to do is enter some text into the text field and then send that content to an alert box. I think my code should work but I get an alert box that says: "undefined". HELP! Code: <html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=ISO-8859-1">
<title>Untitled</title>
<script type="text/javascript">
function verify_score(val1)
{
var temp = document.getElementById(val1)
alert(temp.value)
}
</script>
</head>
<body>
<div id="PageDiv" style="position:relative; min-height:100%; margin:auto; width:200px">
<form name="scoresheetform" action="">
<div id="Submitbutton" style="position:absolute; left:52px; top:87px; width:110px; height:33px; z-index:1">
<input type=submit name="Submitbutton" value="Submit Form" onClick="verify_score()"></div>
<div id="HomePlayer1Rnd6Pnts" style="position:absolute; left:9.822px; top:37px; width:45px; height:29px; z-index:2">
<input name="HomePlayer1Rnd6Pnts" onBlur="verify_score('HomePlayer1Rnd6Pnts')" size=3></div>
<div id="HomePlayer1Rnd7Pnts" style="position:absolute; left:79.822px; top:37px; width:45px; height:29px; z-index:3">
<input name="HomePlayer1Rnd7Pnts" onBlur="verify_score('HomePlayer1Rnd7Pnts')" size=3></div>
<div id="HomePlayer1TotalPnts" style="position:absolute; left:146px; top:37px; width:45px; height:29px; z-index:4">
<input name="HP1 Total Points" size=3></div>
</form>
</div>
</body>
</html>
Alright so i've been trying to code a layout with multiple 'frames' . What I usually do is use the following script: Code: <center>
<script>
function changeNavigation(id)
{document.getElementById('navigate').innerHTML=document.getElementById(id).innerHTML}
</script>
<noembed>
<body>
</noembed>
And then add all the divs which are linked to an imagemap, like this: Code: <img src="IMAGE" width="HERE" height="HERE" border="0" usemap="#ImageMap1">
<div style="width:HEREpx; height:HEREpx; position:absolute; left:HEREpx; top:HEREpx; z-index:1; overflow:auto;"
id="HERE">
Blaa
</div>
<div style="display:none; overflow=none"; id="HERE">
And add as many as I need of these.
</div>
<map name="ImageMap1">
<area shape="HERE" coords="HERE" name="HERE"
onClick="changeNavigation('HERE')">
</map>
This always works fine when I have one 'navigation' frame. However this time I need to code a layout with multiple frames. I have tried starting a new script and linking to a new imagemap to do that. But what it does is it duplicates the image and the divs dont appear when clicking on a 'button'. This is the layout I am coding As you can see, each box has its own 'buttons' which should link to a div. I can do it for one of the boxes and its divs, but cant figure out how to do it for the others so it works. Did my best to make this sound non-confusing. Hopefully someone will be able to help. I've spent three days trying to figure this out without any luck. What i am attemping to do is to open an unframed tab using the link from a frame id. I want to be able to enter a js command in the browser on the page then have it open in a new tab unframed or just reload the link unframed. These are the commands i have tried in my browser: javascript:<a herf="document.getElementById("netlinkx").childNodes[1].src;"> javascript:<a herf="window.location.href=document.getElementById("netlinkx").childNodes[1].src;"> javascript:<a herf=document.getElementById("netlinkx").children[0]>.setAttribute('id','this_one');alert(getFrame("this_one").body.innerHTML);> and a few others that didn't work. |
|||||||