我创建了一个用于拼写练习的网页。 我像这样显示SQL中的所有内容:
public void FillPageSpelling()
{
ArrayList videoList1 = new ArrayList();
if (!IsPostBack)
{
videoList1 = ConnectionClass.GetSpelling(1);
}
else
{
int i = Convert.ToInt32(DropDownList1.SelectedValue);
videoList1 = ConnectionClass.GetSpelling(i);
}
StringBuilder sb = new StringBuilder();
foreach (Spelling sp in videoList1)
{
sb.Append(
string.Format(
@"<table class='VideoTable'>
<tr>
<td align='center'><font face='Verdana'> <font size='3'>Level:</font> <font size='2'>{3}</font></font></td>
</tr>
<tr>
<td align='center'><font face='Verdana'> <font size='3'>Sentence:</font> <font size='2'>{1}</font></font></td>
</tr>
<tr>
<td align='center'><font size='3'>Sound:<audio controls><source src=sound/{2}></audio>
<font face='Verdana'> <font size='2'> </font> </font></td>
</tr>
<tr>
<tr><td align='center'><font face='Verdana'> <font size='3'>Write the word here: <input type=text id=TextBox1></font></font> </td> </tr>
<td><input type=button value='Check' class='p-userButton' onClick='ButtonClick(document.getElementById(""TextBox1"").value, document.getElementById(""TextBox2"").value);'/></td>
<td><input type=button value='Cheat' class='p-userButton' onClick='Cheat(document.getElementById(""TextBox2"").value);' </td>
</tr>
<tr>
<td align='center'><font face='Verdana'><input type=text style=display:none id=TextBox2 value={4}></td>
</tr>
</br>
</table>", sp.SID, sp.Sentence, sp.Audio, sp.Level, sp.Word));
lblOutput.Text = sb.ToString();
}
这是我在下拉列表中选择第2级时的样子:
这是检查单词是否良好的javascript函数:
<script type="text/javascript">
function ButtonClick(a, b)
{
if (a.toString() == b.toString())
{
alert("Correct!");
}
else
{
alert("Wrong!");
}
}
</script>
这是我创建按钮并调用函数的方法:
<input type=button value='Check' class='p-userButton' onClick='ButtonClick(document.getElementById(""TextBox1"").value, document.getElementById(""TextBox2"").value);'/>
现在,这对第一句话很有效,但当我转到下面的第二句时,当我在文本框中输入单词时,它只检查第一句,而不是第二句。
关于如何解决这个问题的任何想法?
答案 0 :(得分:2)
多个页面元素不应该具有相同的ID#。这就是为什么你在使用&#39; id&#39;时不断获得第一个元素的原因。抓住文本框,因为文本框上的ID都是相同的。您可以创建一个迭代器,在每次循环中递增,并使用它在每个文本框ID的末尾放置一个唯一的数字(在文本框本身和生成的javascript中)。