/    Sign up×
Community /Pin to ProfileBookmark

setting function variables

I am trying to put together a page and my js experience is very limited. I think I have overstepped myself! This is probably a very simplistic problem for an expert

The page is for drill in learning some Egyptian hieroglyphs. There are 106 characters formatted in a table per the examples that follow (the href Onclick works!):

[SIZE=”2″]<td align=”center” valign=”middle”><!– F40 –><a href=”” OnClick=”javascript:MyFunction();return false;”><span class=”p1″>&#998052;</span></a></td>
<td align=”center” valign=”middle”><!– U23 –><a href=”” OnClick=”javascript:MyFunction();return false;”><span class=”p1″>&#1001351;</span></a></td>
[/SIZE]

I have definitions for each character formatted as follows:

[SIZE=”2″]<div id=”Definition_1″><font size=”1″> MdC</font>&nbsp;&nbsp;<span class=”mdc”>Aw</span>&nbsp;&nbsp;<font size=”1″>Transliteration</font>&nbsp;&nbsp;<span class=”trans”>Aw</span>&nbsp;&nbsp;<font size=”1″>Gardiner code</font>&nbsp;&nbsp;<span class=”gard”> F40</div></span><br>
<div id=”Definition_2″><font size=”1″> MdC</font>&nbsp;&nbsp;<span class=”mdc”>Ab, mr </span>&nbsp;&nbsp;<font size=”1″>Transliteration</font>&nbsp;&nbsp;<span class=”trans”>Ab, mr </span>&nbsp;&nbsp;<font size=”1″>Gardiner code</font>&nbsp;&nbsp;<span class=”gard”> U23</div></span><br>[/SIZE]

My goal is to click the character and have the translation put into a div / box called <div id=”AnswerBox”></div>.

I have worked on the function below:

<script language=”javascript”>
function MyFunction()
{
document.getElementById(“????”).innerHTML=”????”;
}
</script>

Three questions:
How do I set up a variable for the definitions?
How do I set it up in my function?
How do I target my answer div with the definition?

I think it is all possible but I just don’t have the experience. I will be profoundly grateful to anyone who can point me in the right direction.

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@TheBearMayJun 23.2009 — Not sure that I'm completely clear on what you mean by definitions, but I'll take a shot:

[code=html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" >

var charArray = new Array();
charArray ["F40"] = '<div id="Definition_1"><font size="1"> MdC</font>&nbsp;&nbsp;<span class="mdc">Aw</span>&nbsp;&nbsp;<font size="1">Transliteration</font>&nbsp;&nbsp;<span class="trans">Aw</span>&nbsp;&nbsp;<font size="1">Gardiner code</font>&nbsp;&nbsp;<span class="gard"> F40</div></span><br>';

function MyFunction(arrLookup) {
document.getElementById("AnswerBox").innerHTML = charArray[arrLookup];
}

</script>
</head>

<body>
<table>
<tr>
<td align="center" valign="middle"><!-- F40 --><a href="#" onclick="MyFunction('F40');return false;"><span class="p1">&#65533;&#65533;</span></a></td>
</tr>
</table>

<div id="AnswerBox">

</div>
</body>
</html>[/code]
×

Success!

Help @rhiohb spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...