关于html：Javascript .submit()覆盖必填字段

Javascript .submit() overrides required field

我有一个表格，希望在发送之前先经过模式确认。我用JavaScript做到这一点。我打开模态，然后在其中使用.submit()函数，但它不考虑"必填"字段就发送了表单。

这是我用http://www.w3schools.com/制作的一个示例：

1
2
3
4
5
6
7
8
9
10
11
12
13

<!DOCTYPE html>
<html>
<body>

<form id="some" action="demo_form.asp">
Username: <input type="text" name="usrname" required>
<input type="submit">
</form>

<p>Note: The required attribute of the input tag is not supported in Internet Explorer 9 and earlier versions, or in Safari.</p>
<button type="button" onclick="document.getElementById('some').submit();">Send anyway</button>
</body>
</html>

这是小提琴：http://jsfiddle.net/fmpk1h1m/

我想要的是required属性的相同效果，无论我直接发送表单还是通过JavaScript发送表单。

相关讨论

触发表单提交按钮，单击：

1
2
3
4
5
6
7
8
9

var form = document.getElementById('form');
var submitButton = document.getElementById('submit-button');
var sendButton = document.getElementById('send-button');

sendButton.addEventListener('click', send);

function send(e) {
submitButton.click();
}

http://jsfiddle.net/8rwfspbt/1/

相关讨论

.submit()不会检查required HTML属性。您可以通过使用JavaScript模拟click事件来实现类似的目的：

1	document.getElementById('btn').click();

JSFiddle

相关讨论

将按钮放入表单本身，不需要javascript。

1
2
3
4
5
6
7
8
9
10
11
12
13

<!DOCTYPE html>
<html>
<body>

<form id="some" action="demo_form.asp">
Username: <input type="text" name="usrname" required>

<p>Note: The required attribute of the input tag is not supported in Internet Explorer 9 and earlier versions, or in Safari.</p>
<input type="submit" value="Send">
</form>

</body>
</html>

您应该在表单中使用input type="submit"，而不是在表单外部创建按钮。

相关讨论