Javascript 中的 .innerHTML
Posted
技术标签:
【中文标题】Javascript 中的 .innerHTML【英文标题】：.innerHTML in Javascript 【发布时间】：2011-12-17 20:14:14 【问题描述】：我正在尝试使用 div 验证登录页面以显示错误，我正在使用 innerhtml 更改发生错误的 div 中的空文本，问题是错误消息已写入并消失就在一秒钟内
这里是代码
<html>
<head>
<title>
Sign up for a membership @ Ay 7aga.com
</title>
<script type="text/javascript">
function check()
var x = "";
if(document.getElementById('user').value =="")
x+="Enter user name -";
if(document.getElementById('password').value =="")
x+="Enter password";
document.getElementById('error1').innerHTML = x;
</script>
</head>
<body>
<div name="error" id="error" style="width:1200px;background-color:red">
<p name="error1" id="error1">
</div>
<center>
<br/>
<form name="register" id="register" >
<table>
<tr>
<td> UserName </td>
<td> <input type="text" id="user" /> </td>
</tr>
<tr>
<td> Password </td>
<td> <input type="password" name="password" id="password"/></td>
</tr>
</table>
<button onclick="check()"> Submit </button>
</form>
<a href="Home page.html"> Go to Home page </a>
</center>
</body>
</html>
【问题讨论】：
将check() 放在<form onsubmit="return check();"> 处理程序上，并从function check() 返回true 或false。
也尽量不要使用.innerHTML这是邪恶的
【参考方案1】：
当使用<button> 标签时，“type”属性很重要：大多数浏览器（正确地）默认类型为“submit”，这使得它可以作为表单提交元素工作。您可以改为将类型设置为“按钮”，这使得按钮除了触发事件处理程序之外没有本机行为。因此：
因此：
<button onclick="check()" type=button>Submit</button>
将阻止按钮导致表单的隐式提交。
【讨论】：
【参考方案2】：您以错误的方式接近它。可能发生的情况是您的 for 在单击登录按钮后被提交，这就是文本在几秒钟内“消失”的原因。
将您的登录检查放在服务器端，并为该特定场景生成 HTML 内容，而不是使用 JavaScript。
顺便说一句：你使用的 <button> 标签是什么？
【讨论】：
这可能是一直存在于 HTML 中的<button> 标签 :-) 标签的问题在于，在某些浏览器中，“type”属性默认为“submit”。如果“type”设置为“button”，则不会触发表单提交。
+1 默认情况下，按钮元素是提交元素（如果没有给出type 属性）。 w3.org/TR/html4/interact/forms.html#h-17.5
我考虑过提交问题，但我认为由于按钮不是提交类型，因此不会提交。我没有注意到
@Pointy：哇！这些年来编写 HTML 并且之前从未听说过标签 <button>... 一直使用 <input type="button">。它是为了向后兼容吗？还是比<input type="button"> 更新？
@PabloSantaCruz <button> 的好处是您可以将它包裹在 <img> 标签等周围；基本上是大多数内联内容（有点像<a>）以上是关于Javascript 中的 .innerHTML的主要内容，如果未能解决你的问题，请参考以下文章