我想停止提交整个页面，只使用 javascript 提交我的表单答案

【问题标题】：I want to stop submitting the whole page and submit only my form using javascript我想停止提交整个页面，只使用 javascript 提交我的表单
【发布时间】：2019-08-12 16:06:43
【问题描述】：

我已经添加了 JS 和 HTML 代码。它会提交整个页面，但我不希望这样。我只想提交我的表单。

function submit_by_id()
		{
			var name = document.getElementById("name").value;
			var email = document.getElementById("email").value;
			if (!validation()) // Calling validation function
			{
				return false;
			}
			else
			{
				alert("working fine");
				return true;
			}
		}
		

		
form validation function currently for email and pwd

		function validation()
		{
			var name = document.getElementById("name").value;
			var email = document.getElementById("email").value;
			if (name === '' || email === '')
			{
				alert("Please fill all fields...!!!!!!");
				return false;
			}
			else
			{
			return true;
			}
		}

this is html code

<form name ="myform" id="myform"  onsubmit=" return submit_by_id()" action="#">
					  	<div class="form-group">
						    <label for="email">Email address:</label>
						    <input type="email" class="form-control" id="email">
						</div>
						<div class="form-group">
						    <label for="name">name:</label>
						    <input type="text" class="form-control" id="name">
						</div>
						<button type="Submit"   class="btn btn-primary">Submit</button>
					</form>

【问题讨论】：

submit_by_id() 你的函数得到一个事件对象，你应该在你的函数中调用 event.preventDefault
onsubmit 事件中，您无需在 submit_by_id() 之前添加 return。

标签： javascript html css ajax flask

【解决方案1】：

我认为您正在寻找无法提交页面的技术，

通读https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX

一个简单的库是https://github.com/axios/axios

【讨论】：

【解决方案2】：

您不必使用函数进行验证，只需使用“必需”

<input type="text" class="form-control" id="name" required>

要阻止页面在提交时重新加载，请使用event.preventDefault()

【讨论】：

具体来说，我应该在哪里使用这个 event.preventDefault()

【解决方案3】：

   

function submit_by_id()
		{
			var name = document.getElementById("name").value;
			var email = document.getElementById("email").value;
			alert("working fine");
		}

<form name ="myform" id="myform" action="#" onsubmit=" return submit_by_id()" required>
		<div class="form-group">
			<label for="email">Email address:</label>
			<input type="email" class="form-control" id="email" required>
		</div>
		<div class="form-group">
			<label for="name">name:</label>
			<input type="text" class="form-control" id="name" required> 
		</div>
		<button   class="btn btn-primary">Submit</button>
	</form>

【讨论】：