我在 JSP 文件上有以下代码,我想要 <label>
的文本。名为“complemento”的名称将根据 <select>
中选择的选项进行更改名为“蒂波”。 javascript代码是否有任何错误,因为当我在浏览器中打开页面时,它无法按预期工作。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Cadastra Usuario</title>
<script>
function mudaTexto(tipo) {
var opcao_index = tipo.selectedIndex;
var opcao = tipo.options[opcao_index].value;
if(opcao == '0')
document.getElementById('complemento').innerHTML = 'Periodo';
else if(opcao == '1')
document.getElementById('complemento').innerHTML = 'Titulo';
else
document.getElementById('complemento').innerHTML = 'Status';
}
</script>
</head>
<body>
<p align="center">
<span class="usuario">${nome}</span> | <strong> Hora Livre</strong> | <a href="/hora_livre/ProcessaSaida"> Sair</a>
</p>
<p align="center">
<form method="post" action="/hora_livre/CadastraUsuario">
<table>
<tr>
<td>Login: </td> <td><input type="text" name="username"></td>
</tr>
<tr>
<td>Digite uma Senha: </td> <td><input type="password" name="password">
</td>
</tr>
<tr>
<td>Repita a Senha: </td> <td><input type="password" name="senha"></td>
</tr>
<tr>
<td>Tipo de usuario: </td>
<td>
<select name="tipo" onchange="mudatexto(this.form.tipo)">
<option value="0">Aluno</option>
<option value="1">Professor</option>
<option value="2">Funcionario</option>
</select>
</td>
</tr>
<tr>
<td>Nome Completo: </td> <td><input type="text" name="name"></td>
</tr>
<tr>
<td><label for="complemento">Periodo</label></script></label> </td>
<td> <input type="text" name="complemento"></td>
</tr>
<tr colspan=2>
<td><input type="submit" value="Enviar"></td>
</tr>
</table>
</form>
</p>
</body>
</html>
最佳答案
您没有带有 id=complemento 的元素。通过将 id 添加到您的输入来修复此问题
<td><label for="complemento">Periodo</label></script></label> </td> <td><input id="complemento" type="text" name="complemento"></td>
还使用 value 而不是innerHtml,因为它是输入
if(opcao == '0')
document.getElementById('complemento').value= 'Periodo';
else if(opcao == '1')
document.getElementById('complemento').value= 'Titulo';
else
document.getElementById('complemento').value= 'Status';
}
关于javascript - 根据<select>动态更改<label>的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21877891/