Question

178

changing the value of onclick of a td from javascript

rated 0 times [ 185] [ 7] / answers: 1 / hits: 24363 / 12 Years ago, mon, july 2, 2012, 12:00:00

I am trying to change the value of onclick of a td from a function in javascript.
I've tried everything i can think of and i've searched it on the internet but nothing worked, exept from this code below, but the problem with it is that it's executing what i want the value of onclick to be instead of changing it.

<div align=center id=bodyC>

<table width=800 height=410>

<td class=bodyCC>

    <table id=MYtable class=MYtable border=0 width=100% height=100% cellpadding=50>

    <td id=one class=one onclick=></td>

    <td id=two class=two onclick=></td>

    <td id=three class=three onclick=></td>

    </table>

</td>

</table>

</div>





function download()

{

<!-- this function is called when the Download button on the website's menu is pressed, and is soppused to change the body table so when the sells are clicked an alert will pop.-->

document.getElementById('one').onclick=alert(A..!);

document.getElementById('two').onclick=alert(B..!);

document.getElementById('three').onclick=alert(C..!);

}

any help?

p.s. there are no errors.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

aleighabayleef

Add To Favorites

Follow

Total Points: 511

Total Questions: 99

Total Answers: 99

Location: Aruba

Member since Fri, Jun 24, 2022

2 Years ago

answered 12 Years ago margob · Accepted Answer

When you write

document.getElementById('one').onclick=alert(A..!);

you set as onclick handler the the returned value of alert(A..!) : it's undefined. So this can't work.

What you need is a function definition :

document.getElementById('one').onclick = function() {alert(A..!);};

Alternatively, you could have :

function myfunc() {

    alert(A..!);

} 

document.getElementById('one').onclick = myfunc;

But it's fine to write anonymous function definitions, as it keeps the code in the place where it is used and thus is often cleaner.

You also need to have you javascript inside a script element :

<script>

    document.getElementById('one').onclick = function() {alert(A..!);};

    document.getElementById('two').onclick = function() {alert(B..!);};

    document.getElementById('three').onclick = function() {alert(C..!);};

</script>

Here is a complete, fixed, tested version of your page :

<div align=center id=bodyC>

<table width=800 height=100><tr>

<td class=bodyCC>

    <table id=MYtable class=MYtable border=0 width=100% cellpadding=50><tr>

    <td id=one class=one onclick=>ONE</td>

    <td id=two class=two onclick=>TWO</td>

        <td id=three class=three onclick=>THREE</td></tr>

    </table>

    </td></tr>

</table>

    <span onclick=download();>CLICK HERE</span>

</div>

<script>

// this function is called when the Download button on the website's menu

// is pressed, and is soppused to change the body table so when the sells

// are clicked an alert will pop.

function download() {

   document.getElementById('one').onclick=function(){alert(A..!);};

   document.getElementById('two').onclick=function(){alert(B..!);};

   document.getElementById('three').onclick=function(){alert(C..!);};

} 

</script>

(I fixed also the HTML comments, and the missing tr)

You can click test it here : click on CLICK HERE to activate the ability to click on the three other sections (one, two, three).