我试图让一个文本框在被点击时变成一个文本区域。我已经让它自己工作了，但现在我有很多其他的 js 在它周围工作，它不会工作！请帮忙...这里的psenter代码很乱，我要清理它！
<html>
<head>
<title>Grrrr</title>
<script>
//*********************************************
// Function that Shows an HTML element
//*********************************************
function showDiv(divID)
{
var div = document.getElementById(divID);
div.style.display = ""; //display div
}
//*********************************************
// Function that Hides an HTML element
//*********************************************
function hideDiv(divID)
{
var div = document.getElementById(divID);
div.style.display = "none"; // hide
}
//*****************************************************************************
// Function that Hides all the Div elements in the select menu Value
//*****************************************************************************
function hideAllDivs()
{
//Loop through the seclect menu values and hide all
var selectMenu = document.getElementById("selectMenu");
for (var i=0; i<=selectMenu.options.length -1; i++)
{
hideDiv(selectMenu.options[i].value);
}
}
//*********************************************
// Main function that calls others to toggle divs
//*********************************************
function toggle(showID)
{
hideAllDivs(); // Hide all
showDiv(showID); // Show the one we asked for
}
function showHide(shID) {
if (document.getElementById(shID)) {
if (document.getElementById(shID+'-show').style.display != 'none') {
document.getElementById(shID+'-show').style.display = 'none';
document.getElementById(shID).style.display = 'block';
}
else {
document.getElementById(shID+'-show').style.display = 'inline';
document.getElementById(shID).style.display = 'none';
}
}
}
</script>
<style type="text/css">
body,td,th {
font-family: Arial, Helvetica, sans-serif;
}
table.mystyle2
{
border-width: 1px 1px 1px 1px;
border-spacing: 10px;
border-style: solid;
border-color:#039;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
height:350px;
width:700px;
}
table.mystyle3
{
border-width: 1px 1px 1px 1px;
border-spacing: 2px;
border-style: solid;
border-color:#039;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
color:#FFF;
font-size:0.7em;
width:700px;
}
.step {
font-weight: bold;
}
body {
background-image: url(bg.jpg);
background-repeat: no-repeat;
background-position:center top;
}
h3 {
font-size: 16px;
color: #039;
}
h4 {
font-size: 14px;
color: #039;
}
.more {
display: none;
border-top: 0px solid #666;
border-bottom: 0px solid #666; }
a.showLink, a.hideLink {
text-decoration: none;
font-weight: bold;
color: #c9c;
padding-left: 8px;
background: transparent url('doon.gif') no-repeat left; }
a.hideLink {
background: transparent url('up.gif') no-repeat left; }
a.showLink:hover, a.hideLink:hover {
border-bottom: 1px solid #c9c; }
.result {
border-bottom: 5px solid #c9c; }
input[type=text] {
font-size: 80%;
padding: 0.1em;
height: 20px;
margin: 0.1em;
border: 1px solid #000;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
textarea.special {
font-weight:bold;
border: 3px solid #039
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
</style>
</head>
<table align="center"><tr>
<td width="436" height="50"><img src="header.png" width="700" height="80"></td>
</tr></table>
<table border="0" align="center" width="700" class="mystyle2">
<tr>
<td height="438"><form id="SQA Academy wiz" action="process.php" method="post">
<br />
<body onLoad="hideAllDivs();">
<h3>Appointee role being considered:</h3>
<select id="selectMenu" onChange="toggle(this.options[this.options.selectedIndex].value)">
<option value="formNumber">Choose from</option>
<option value="formNumber1">Task Developer</option>
<option value="formNumber2">Task Reviewer</option>
<option value="formNumber3">Assessor</option>
<option value="formNumber4">Visiting Assessor</option>
<option value="formNumber5">Subject Specialist</option>
</select>
<div id="formNumber"></div>
<div id="formNumber1">BBBBBBBBBBBBBBBBBBBB</div>
<div id="formNumber2"><span id="Step4">
<table border="0" cellpadding="2" cellspacing="0">
<tr><td colspan="4">
<h3 align="center">4. Credit & point value</h3>
<p align="justify">SQA Units are expressed in both SQA credit values and SCQF credit points and level.<br /><br />The writing brief will already have determined the SQA credit value and the SCQF credit points and level of the Unit you are writing.<br /><br />For example:<br /><br />
Credit value: 1 HN Credit at SCQF level 7 (8 SCQF credit points at SCQF level 7)
</p>
<div id="wrap">
<p> <a href="#" id="credit-show" class="showLink" onClick="showHide('credit');return false;">Click here for further information</a></p>
<div id="credit" class="more">
<table width="670" align="center">
<tr>
<td align="justify"><p>SQA Units are expressed in both SQA credit values and SCQF credit points and level. The writing brief will already have determined the SQA credit value and the SCQF credit points and level of the Unit you are writing.<br><br>
It is important that you are aware of the notional hours of learning involved, so you can write Units that meet the required level of challenge.
<br><br>
SQA credit values are allocated as follows: <br><br>
10 hours 0.25 credits<br>
20 hours 0.5 credits<br>
40 hours 1.0 credit<br>
60 hours 1.5 credits<br>
80 hours 2 credits<br>
120 hours 3 credits<br><br />
The norm for Units is one credit with a notional design length of 40 hours.<br><br>
SCQF Credit values<br><br>
All SQA qualifications also carry SCQF credit points. The SCQF brings all Scottish qualifications into a single framework ranging from Access 1 to doctorates. It includes degrees, HNC/Ds, National Qualifications, and SVQs.<br><br>
Within the SCQF, every 10 hours of learning equates to 1 SCQF credit point. Most National Units at SCQF levels 1 to 6 are made up of 6 SCQF credit points, or a notional 60 hours of learning. Of these 60 hours, 40 involve programmed learning, such as class contact and assessment. The other 20 hours includes the expected time that an individual learner will be expected to contribute to his/her learning through independent study, such as reading and revision for assessment. For National Units at these levels, it is expected that learners require an additional half of the time required for programmed learning in order to prepare them to undertake a successful learning experience.<br><br>
10 hours 1 credits<br>
20 hours 2 credits<br>
40 hours 4 credits<br>
60 hours 6 credits<br>
80 hours 8 credits<br>
120 hours 12 credits<br><br>
National Units at SCQF level 7, however, are made up of 8 SCQF credit points, or a notional 80 hours of learning. This reflects the fact that SCQF level 7 is the start point for higher education in the framework, and this involves a higher and often deeper level of learning than that undertaken at the lower levels. As such, learning at SCQF level 7 and above places more demands on the learner, including the need for a higher proportion of independent study, which is reflected in the overall learning time.
<br><br>
HN learners are expected to put in an equivalent amount of their own study time, which gives a one credit HN Unit an allocation of eight SCQF points and a two credit HN Unit 16 SCQF credit points.
</p></td>
</tr>
</table>
<p><a href="#" id="credit-hide" class="hideLink" onClick="showHide('credit');return false;">Hide further information.</a></p>
</div>
</div></td></tr>
<tr>
<td align="left">
<h3>What are the SQA credit value and SCQF credit point for this unit?</h3></td>
<td>
<tr>
<td align="right" ><label>SQA Credits</label></td>
<td> </td>
<td align="right"> <select name="SQA" id="textSQA" input>
<option>0.25</option>
<option>0.5</option>
<option>1.0</option>
<option>1.5</option>
<option>2.0</option>
<option>3.0</option>
</select></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="right"><label>SCQF Credits</label></td>
<td> </td>
<td align="right" > <select name="SCQF" id="textSCQF" input>
<option>1</option>
<option>2</option>
<option>4</option>
<option>6</option>
<option>8</option>
<option>12</option>
</select></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="right"><label>SCQF Level</label></td>
<td> </td>
<td align="right"> <select name="SCQFL" id="textSCQFL" input>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select></td>
</tr>
</table>
</span></div>
<div id="formNumber3"><span id="Step2">
<table border="0" cellpadding="2" cellspacing="0">
<tr><td colspan="4">
<h3 align="left">(2) 2.15.1 Have knowledge and understanding of the principles of assessment, recording and reporting</h3>
<p align="justify">Blurb from Brendan
Blurb from Brendan, Blurb from Brendan, Blurb from Brendan, Blurb from Brendan, Blurb from Brendan, Blurb from Brendan, Blurb from Brendan, Blurb from Brendan. </p>
<div id="wrap">
<p> <a href="index.html" id="example-show" class="showLink" onClick="showHide('example');return false;">Click here for key tips</a></p>
<div id="example" class="more">
<table width="670" align="center">
<tr>
<td align="justify"><p><strong>Remember that the title is often the first (and perhaps only) thing that some people will read before deciding whether to use the Unit. You should try to ensure that the title indicates clearly the area of skills and/or knowledge covered.</strong></p>
<p><strong>Some key tips:</strong></p>
<p>Don't use 'the' at the start of the title. This will help with alphabetical listings. For example, 'Using Accounting Information' would be better than 'The Use of Accounting Information'.<br /><br />
Where the Unit is 'An introduction…' or 'Introduction to…' the main part of the title should be first. Then use a colon, followed by 'An Introduction'. For example, you could title a Unit 'Working in a Business Enterprise: An Introduction'.<br /><br />
Where a Unit is part of a Course and the title relates clearly to the subject area, there is no need for the Course stem to be part of the title. For example, 'Geography: Geographical Study (Advanced Higher)' would be better as 'Geographical Study (Advanced Higher)'.<br /><br />
Where the title of a Unit could relate to a number of different subjects and it is not clear from the Unit title which subject area the Unit belongs to, the Course title should be inserted as a stem (followed by a colon). For example French: Language (Higher).<br /><br />
Where Unit titles have sub-divisions of the title within them, the subdivision should be introduced by a colon. For example, Manufacturing Systems: Characteristics.<br /><br />
Don't use brackets in Unit titles — this is because the level will appear in brackets at the end of each title. </p>
<p>
You should not use numbers in a title to indicate progression through different levels. Progression will be shown by the level of the Unit.</p></td>
</tr>
</table>
<p><a href="#" id="example-hide" class="hideLink" onClick="showHide('example');return false;">Hide key tips.</a></p>
</div>
</div>
</td></tr>
<tr>
<td width="476" align="left">
<h3 align="justify">Does your appointee have to know or do the following..</h3><br /><p>
1.know and understand how to apply the principles of assessment, recording and reporting as an integral part of the teaching process.</p>
<h3>If yes then describe in the box</h3></td>
<td width="190" align="right">
<span id="CBox0">
<input type="checkbox" name="CBox0" value="A" onchange="HideElem('CBox0','TBox0')">Tick for yes
</span>
<input type="text" id="TBox0" name="TBox0" value="Type here" style="display:none"></td>
</tr>
</table>
</span></div>
<div id="formNumber4">FFFFFFFFFFFFFFFFF</div>
<div id="formNumber5">GGGGGGGGGGGGGGGGG</div>
<input id="SubmitFinal" type="submit" value="Submit" disabled="disabled" />
<INPUT TYPE="reset" VALUE= "clear"></td>
</body>
</html>