Noa*_*Gal 15 html forms appearance
我有这段代码:
<div>
<form name='profileForm' id='profileForm' action='' method='get'>
<input type='submit' name='ProfileBtn' id='ProfileBtn' class='buttonC' value='My Profile' />
</form>
<br />
<form name='logoutForm' id='logoutForm' action='' method='get'>
<input type='submit' name='LogOutBtn' id='LogOutBtn' class='buttonC' value='Logout' />
</form>
</div>
Run Code Online (Sandbox Code Playgroud)
当我渲染上面时,"profileForm"没有出现(尽管profileBtn出现了).这种形式没有问题,这很奇怪,因为它们都很相似.
这可能是一个简单的问题,但我不知道问题是什么.
小智 28
这恰好发生在我身上使用Chrome - 因为我在表单中有一个表单.看起来Chrome只是剥离了<form>打开和关闭标签,因为我的表单是另一种形式.当我将一个表单移到另一个表单之外时,两个<form>标签都按照预期在html中呈现.
克拉克曼也在他的回答中得到了这个.
如果没有看到你的完整HTML,很难给出一个直接的解决方案,但我猜这是你的问题 - 你需要确保你的表单不在另一种形式.非常简单的例子来说明这一点:
在另一个表单中填写表单,请注意如果您在Chrome中运行此代码并检查<form id ="form2">是否未呈现:
<html>
<head></head>
<body>
<form id="form1">
<div>form within a form</div>
<form id="form2">
<input type="text" placeholder="name" /><br/>
<input type="text" placeholder="title" />
</form>
</form>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
如果移动Form1的外部窗口2,运行在浏览器的代码,并检查,然后<表格ID ="窗口2"> 被呈现:
<html>
<head></head>
<body>
<form id="form1">
<div>form2 moved outside of form1</div>
</form>
<form id="form2">
<input type="text" placeholder="name" /><br/>
<input type="text" placeholder="title" />
</form>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
然后不知何故,表格有一个奇怪的问题,按钮没有显示,因为当我运行网站时,'profileForm'以某种方式消失了(并没有出现在控制台中).我所做的是在'profileForm'之前添加第三个Form,它以某种方式解决了这个问题.
在这些行之前,您的代码中有一个未关闭的 HTML 标记,例如 <form>,
Find and close that form
Run Code Online (Sandbox Code Playgroud)
或者
放在</form>你的代码之前。
只需在表格顶部放一个空表格。然后所有表单都将显示表单 id
<form></form>
<form name='profileForm' id='profileForm' action='' method='get'>
<input type='submit' name='ProfileBtn' id='ProfileBtn' class='buttonC' value='My Profile' />
</form>
<form name='logoutForm' id='logoutForm' action='' method='get'>
<input type='submit' name='LogOutBtn' id='LogOutBtn' class='buttonC' value='Logout' />
</form>
Run Code Online (Sandbox Code Playgroud)