我想在 HTML 中创建一个表单，该表单可以采用用户插入的名称，然后在按下提交后向该用户显示相应的值(年龄)。这是我的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="MyMain.css">
<script language="JavaScript">
function myFunction() {
document.getElementById('myshow').innerHTML =
document.getElementById("Name").value;
}
</script>
</head>
<body>
<div class="container">
<div>
<fieldset>
<form action="">
<div class="row">
<div form-group">
<label for="fname">Your Name: </label>
<input type="text" class="form-control" name="name" id="Name" placeholder="Jon" value="">
</div>
</div>
<div>
<input type="submit" class="button" onclick="myFunction();" value="Submit"<br/>
</div>
</div>
</form>
</fieldset>
</div>
</div>
<div class="container">
<fieldset>
<div>
<label>Age: </label>
<p><span id='myshow'></span></p>
</div>
</fieldset>
</div>
</body>
</html>
问题是在按下提交后，名称将显示在 myshow span 部分(年龄:)
几分之一秒然后它消失并且 url 更改为 localhost:5000/?Name=Jack 而不是 localhost:5000/the current path/?Name=Jack
最佳答案
您应该在表单元素上使用onSubmit 来调用该函数然后返回false。
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="MyMain.css">
<script language="JavaScript">
function myFunction() {
document.getElementById('myshow').innerHTML =
document.getElementById("Name").value;
return false;
}
</script>
</head>
<body>
<div class="container">
<div>
<fieldset>
<form action="" onSubmit="return myFunction();">
<div class="row">
<div form-group">
<label for="fname">Your Name: </label>
<input type="text" class="form-control" name="name" id="Name" placeholder="Jon" value="">
</div>
</div>
<div>
<input type="submit" class="button" value="Submit"><br/>
</div>
</div>
</form>
</fieldset>
</div>
</div>
<div class="container">
<fieldset>
<div>
<label>Age: </label>
<p><span id='myshow'></span></p>
</div>
</fieldset>
</div>
</body>
</html>
ps:你没有正确关闭提交标签
关于javascript - 按提交后插入的值消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59477977/