473,382 Members | 1,390 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,382 software developers and data experts.

javascript error on div

I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?

------------------------------------------------------------------------------------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>

<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>

May 19 '07 #1
12 1683
On 19 May 2007 08:56:02 -0700, in comp.lang.javascript
"us***@yahoo.com" <us***@yahoo.com>
<11*********************@n59g2000hsh.googlegroups. comwrote:
>| I have the following code in my html file. Somehow the "retry" div is
| always displaying and it has "addr has no properties" js error. What I
| want is: NOT display "retry" div and only display after clicks "the
| URL" link. Anything is wrong in the code?
|
| ------------------------------------------------------------------------------------------------------------------------------
| <script type="text/javascript"><!--
| function toggleRetry(val) {
| var addr = document.getElementById('retry')
| if (val) {
| addr.style.display='';
| } else {
| addr.style.display='none';
| }
| }
| //--</script>
|
| <script>toggleRetry(true)</script>
This line is executing before the page has been completely loaded.

>| <h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
| onclick="toggleRetry(true)">the URL</a>.</h3>
|
| <div id="retry" style="display:block">
| <table>
| <tr>
| <td>Display Retry</td>
| </tr>
| </table>
| </div>
Try:
<body onload="toggleRetry(true);">
---- then the rest of your code without the offending line.
---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
May 19 '07 #2
Sorry, the code snippet should be:

<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>

<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(false)">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>

So if I do <body onload="toggleRetry(false);">, the "retry" div won't
be displayed when the page is loaded. (Good!) But when I click "the
URL", the "retry" div still won't be displayed and it has "add has no
properties" js error.

On May 19, 9:38 am, Jeff North <jnort...@yahoo.com.auwrote:
On 19 May 2007 08:56:02 -0700, in comp.lang.javascript
"u...@yahoo.com" <u...@yahoo.com>

<1179590162.633129.79...@n59g2000hsh.googlegroups. comwrote:
| I have the following code in my html file. Somehow the "retry" div is
| always displaying and it has "addr has no properties" js error. What I
| want is: NOT display "retry" div and only display after clicks "the
| URL" link. Anything is wrong in the code?
|
| ------------------------------------------------------------------------------------------------------------------------------
| <script type="text/javascript"><!--
| function toggleRetry(val) {
| var addr = document.getElementById('retry')
| if (val) {
| addr.style.display='';
| } else {
| addr.style.display='none';
| }
| }
| //--</script>
|
| <script>toggleRetry(true)</script>

This line is executing before the page has been completely loaded.
| <h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
| onclick="toggleRetry(true)">the URL</a>.</h3>
|
| <div id="retry" style="display:block">
| <table>
| <tr>
| <td>Display Retry</td>
| </tr>
| </table>
| </div>

Try:
<body onload="toggleRetry(true);">
---- then the rest of your code without the offending line.
---------------------------------------------------------------
jnort...@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

May 19 '07 #3
Sorry, the code snippet should be:

<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>

<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(false)">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>

So if I do <body onload="toggleRetry(false);">, the "retry" div won't
be displayed when the page is loaded. (Good!) But when I click "the
URL", the "retry" div still won't be displayed and it has "add has no
properties" js error.

On May 19, 9:38 am, Jeff North <jnort...@yahoo.com.auwrote:
On 19 May 2007 08:56:02 -0700, in comp.lang.javascript
"u...@yahoo.com" <u...@yahoo.com>

<1179590162.633129.79...@n59g2000hsh.googlegroups. comwrote:
| I have the following code in my html file. Somehow the "retry" div is
| always displaying and it has "addr has no properties" js error. What I
| want is: NOT display "retry" div and only display after clicks "the
| URL" link. Anything is wrong in the code?
|
| ------------------------------------------------------------------------------------------------------------------------------
| <script type="text/javascript"><!--
| function toggleRetry(val) {
| var addr = document.getElementById('retry')
| if (val) {
| addr.style.display='';
| } else {
| addr.style.display='none';
| }
| }
| //--</script>
|
| <script>toggleRetry(true)</script>

This line is executing before the page has been completely loaded.
| <h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
| onclick="toggleRetry(true)">the URL</a>.</h3>
|
| <div id="retry" style="display:block">
| <table>
| <tr>
| <td>Display Retry</td>
| </tr>
| </table>
| </div>

Try:
<body onload="toggleRetry(true);">
---- then the rest of your code without the offending line.
---------------------------------------------------------------
jnort...@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
May 19 '07 #4
Lee
us***@yahoo.com said:
>
Sorry, the code snippet should be:

<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>
This bit of code:

<a href="#" onclick="toggleRetry(false)">the URL</a>.

tells the browser to execute your function and then, after
that onclick handler has finished, to load "#", which means
to reload the page and scroll to the top.

If you don't want to reload the page, your onclick handler
should return false.

onclick="toggleRetry(false);return false"

The "<!--" "//-->" comments serve no purpose, by the way.
You're not likely to come across any browsers that don't
know what the <scripttag means.
--

May 19 '07 #5
On May 19, 2:35 pm, Lee <REM0VElbspamt...@cox.netwrote:
u...@yahoo.com said:
Sorry, the code snippet should be:
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>

This bit of code:

<a href="#" onclick="toggleRetry(false)">the URL</a>.

tells the browser to execute your function and then, after
that onclick handler has finished, to load "#", which means
to reload the page and scroll to the top.

If you don't want to reload the page, your onclick handler
should return false.

onclick="toggleRetry(false);return false"

The "<!--" "//-->" comments serve no purpose, by the way.
You're not likely to come across any browsers that don't
know what the <scripttag means.

--
Hm...it is not working. I added <body onload="toggleRetry(false);">
but I got "addr has no properties" right after loading the page. And
with onclick="toggleRetry(false);return false", after clicking the
link, it still won't display the div...

May 20 '07 #6
us***@yahoo.com wrote on 20 mei 2007 in comp.lang.javascript:
On May 19, 2:35 pm, Lee <REM0VElbspamt...@cox.netwrote:
>u...@yahoo.com said:
>Sorry, the code snippet should be:
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
addr.style.display='block';

is more logical since you had set the default style as:
>>><div id="retry" style="display:block">
but why not set the style to:

<div id="retry" style="display:none;">

and there should be no need for the onload in:
>>><body onload="toggleRetry(false);">
} else {
addr.style.display='none';
}
}
A short version:

function toggleRetry(val) {
document.getElementById('retry').style.display =
(val) ?'block' :'none';
}
>//--</script>

This bit of code:

<a href="#" onclick="toggleRetry(false)">the URL</a>.

tells the browser to execute your function and then, after
that onclick handler has finished, to load "#", which means
to reload the page and scroll to the top.

If you don't want to reload the page, your onclick handler
should return false.

onclick="toggleRetry(false);return false"

The "<!--" "//-->" comments serve no purpose, by the way.
You're not likely to come across any browsers that don't
know what the <scripttag means.

--

Hm...it is not working. I added <body onload="toggleRetry(false);">
but I got "addr has no properties" right after loading the page.
Show the error line.
And
with onclick="toggleRetry(false);return false", after clicking the
link, it still won't display the div...
Logical, my dear Watson, it should be:

onclick='toggleRetry(true);return false'

Why not try an even shorter version:

=====================================
<script type="text/javascript">
function toggleRetryOn() {
document.getElementById('retry').style.display =
'block';
}
</script>

<a href="#"
onclick="toggleRetryOn();return false;">Click me</a>

<div id='retry' style='display:none;'>
Display Retry
</div>
======================================

Finally using an anchor/link <a></ato execute a code function seems
illogical, as you would have to think about
the resulting page reloading if js is not available.

Use a button:

<button
onclick='toggleRetryOn();return false;'>
Click me</button>

Or a css pseudo-anchor:

<span
onclick = 'toggleRetryOn();return false;'
style = 'cursor:pointer;color:navy;text-decoration:underline;'
onmouseover = 'this.style.color="red";'
onmouseout = 'this.style.color="navy";'
>Click me</span>



--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 20 '07 #7
I wrote on 20 mei 2007 in comp.lang.javascript:
Use a button:

<button
onclick='toggleRetryOn();return false;'>
onclick='toggleRetryOn();'>
Click me</button>

Or a css pseudo-anchor:

<span
onclick = 'toggleRetryOn();return false;'
onclick='toggleRetryOn();'>
style = 'cursor:pointer;color:navy;text-decoration:underline;'
onmouseover = 'this.style.color="red";'
onmouseout = 'this.style.color="navy";'
>>Click me</span>


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 20 '07 #8
On May 19, 11:56 am, "u...@yahoo.com" <u...@yahoo.comwrote:
I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?

---------------------------------------------------------------------------*---------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>

<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
The third line of your code is missing the terminating semicolon. So
the declaration of the object variable, addr, is ignored and explains
why it has no properties.

May 20 '07 #9
On May 20, 10:41 am, Herbert Blenner <a1ea...@aol.comwrote:
On May 19, 11:56 am, "u...@yahoo.com" <u...@yahoo.comwrote:
I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?
---------------------------------------------------------------------------*---------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>
<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>
<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>

The third line of your code is missing the terminating semicolon. So
the declaration of the object variable, addr, is ignored and explains
why it has no properties.
I've put my code with your suggestions into a html file:
<html>
<head>
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry');
if (val) {
addr.style.display='block';
} else {
addr.style.display='none';
}
}
//--</script>
<body">

<script>toggleRetry(false)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true);return false">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
</body>
</head>
</html>

I got a "addr has no properties" right after loading the page. I think
<script>toggleRetry(false)</scriptand
onclick="toggleRetry(true);return false" both are failing because "var
addr = document.getElementById('retry');" is failing. Any idea why?

May 20 '07 #10
On May 20, 2:59 pm, "u...@yahoo.com" <u...@yahoo.comwrote:
On May 20, 10:41 am, Herbert Blenner <a1ea...@aol.comwrote:


On May 19, 11:56 am, "u...@yahoo.com" <u...@yahoo.comwrote:
I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?
---------------------------------------------------------------------------**---------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>
<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>
<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
The third line of your code is missing the terminating semicolon. So
the declaration of the object variable, addr, is ignored and explains
why it has no properties.

I've put my code with your suggestions into a html file:
<html>
<head>
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry');
if (val) {
addr.style.display='block';
} else {
addr.style.display='none';
}
}
//--</script>
<body">

<script>toggleRetry(false)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true);return false">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
</body>
</head>
</html>

I got a "addr has no properties" right after loading the page. I think
<script>toggleRetry(false)</scriptand
onclick="toggleRetry(true);return false" both are failing because "var
addr = document.getElementById('retry');" is failing. Any idea why?- Hide quoted text -

- Show quoted text -
Try changing <body"to <body>. If that does not work then use alert()
to troubleshot the code. I would begin by placing alert(addr) right
after the declaration statement.

Go luck.

May 20 '07 #11
On May 20, 1:40 pm, Herbert Blenner <a1ea...@aol.comwrote:
On May 20, 2:59 pm, "u...@yahoo.com" <u...@yahoo.comwrote:
On May 20, 10:41 am, Herbert Blenner <a1ea...@aol.comwrote:
On May 19, 11:56 am, "u...@yahoo.com" <u...@yahoo.comwrote:
I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?
---------------------------------------------------------------------------**---------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>
<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>
<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
The third line of your code is missing the terminating semicolon. So
the declaration of the object variable, addr, is ignored and explains
why it has no properties.
I've put my code with your suggestions into a html file:
<html>
<head>
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry');
if (val) {
addr.style.display='block';
} else {
addr.style.display='none';
}
}
//--</script>
<body">
<script>toggleRetry(false)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true);return false">the URL</a>.</h3>
<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
</body>
</head>
</html>
I got a "addr has no properties" right after loading the page. I think
<script>toggleRetry(false)</scriptand
onclick="toggleRetry(true);return false" both are failing because "var
addr = document.getElementById('retry');" is failing. Any idea why?- Hide quoted text -
- Show quoted text -

Try changing <body"to <body>. If that does not work then use alert()
to troubleshot the code. I would begin by placing alert(addr) right
after the declaration statement.

Go luck.
Thanks. I set the alert(addr) right after the declaration statement
and it is always returning null on "<script>toggleRetry(false)</
script>". But "onclick="toggleRetry(true);return false" works fine
though and addr has the right value. I am using Firefox and IE so they
should know what <scriptmeans...

May 20 '07 #12
On May 20, 2:59 pm, "u...@yahoo.com" <u...@yahoo.comwrote:
On May 20, 10:41 am, Herbert Blenner <a1ea...@aol.comwrote:


On May 19, 11:56 am, "u...@yahoo.com" <u...@yahoo.comwrote:
I have the following code in my html file. Somehow the "retry" div is
always displaying and it has "addr has no properties" js error. What I
want is: NOT display "retry" div and only display after clicks "the
URL" link. Anything is wrong in the code?
---------------------------------------------------------------------------**---------------------------------------------------
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry')
if (val) {
addr.style.display='';
} else {
addr.style.display='none';
}
}
//--</script>
<script>toggleRetry(true)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true)">the URL</a>.</h3>
<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
The third line of your code is missing the terminating semicolon. So
the declaration of the object variable, addr, is ignored and explains
why it has no properties.

I've put my code with your suggestions into a html file:
<html>
<head>
<script type="text/javascript"><!--
function toggleRetry(val) {
var addr = document.getElementById('retry');
if (val) {
addr.style.display='block';
} else {
addr.style.display='none';
}
}
//--</script>
<body">

<script>toggleRetry(false)</script>
<h3 style="margin-bottom:0px;margin-top:0px;">Test<a href="#"
onclick="toggleRetry(true);return false">the URL</a>.</h3>

<div id="retry" style="display:block">
<table>
<tr>
<td>Display Retry</td>
</tr>
</table>
</div>
</body>
</head>
</html>

I got a "addr has no properties" right after loading the page. I think
<script>toggleRetry(false)</scriptand
onclick="toggleRetry(true);return false" both are failing because "var
addr = document.getElementById('retry');" is failing. Any idea why?- Hide quoted text -

- Show quoted text -
I would try var addr = document.getElementById("retry");
provided addr is only referenced in the current function. If you use
addr elsewhere then declare var addr as a global object.

Herbert

May 21 '07 #13

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

8
by: chrisdude911 | last post by:
how do i add video into a javascript web page with my own custom buttons?
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.