表单按钮在IE11中不工作
表单按钮在IE11中不工作
提问于 2015-02-27 09:54:22
我已经创建了一个带有submit按钮的表单，submit按钮在实际表单之外，但是它使用form属性定位表单。
<form id="myform">
</form>
<button form="myform"></button>我为这个星期的例子道歉。除了IE11之外，所有浏览器都能工作。也就是说，8-10是100%工作的.我有什么办法解决这个问题吗。我不喜欢写剧本。我可以用jQuery来做这件事，但如果可能的话，我宁愿保持干净。
回答 4
Stack Overflow用户
回答已采纳
发布于 2015-02-27 10:03:38
这是一个只有点击事件和一行css的解决方案。(最低)
如果您的按钮必须在表单之外，由于用户界面的设计。
我建议您在表单中添加一个输入提交/按钮：
<form id="myform">
<input type="button" value="Submit" class="myButton" />
</form>
<button id="outerBtn">Submit</button>隐藏输入：
.myButton {display:none;} OR {visibility:none;}使用jQuery触发，单击表单中的输入按钮：
$('#outerBtn').on('click', function(e){
e.preventDefault();
$('.myButton').trigger('click');
});只是简单的回答。应该没事的。如果您不想编写脚本，我建议您将输入按钮/提交保留在表单中。
Stack Overflow用户
发布于 2017-02-11 09:37:02
<form id="form-any-name">
<input type="button" value="Submit" class="myButton" />
</form>
<button type="submit">Submit</button>
<script type="text/javascript">
$(document).ready(function() {
$('button[type=\'submit\']').on('click', function() {
$("form[id*='form-']").submit();
});
});
</script>只需包含就绪提交捕获器上的文档，就可以将该代码放在主js文件中，因为我们捕获了以表单开头的dinamicaly表单id，因此在其他页面中，您可以使用不同的foms:)
Stack Overflow用户
发布于 2021-05-28 09:29:45
我想发布我的答案，因为这篇文章对我有很大帮助，如果你想在旧的浏览器上添加“表单之外的按钮”功能的话，我想出了一个可行的主意。
我使用JQuery，但我认为使用纯JS并不是一个大问题，因为它不是复杂的代码。
就像这里提到的一些答案一样，创建一个类
.hiddenSubmitButton {
display: none;
}$("body").on("click", "button[form]", function () {
/*This will get the clicks when make on buttons with form attribute
* it's useful as we commonly use this property when we place buttons that submit forms outside the form itself
*/
let form, formProperty, formAttribute, code, newButtonID;
formProperty = $(this).prop("form");
if (!(formProperty === null || formProperty === "")) {//Most browsers that don't wsupport form property will return null others ""
return; //Browsers that support the form property won't continue
}
formAttribute = $(this).attr("form");
form = $("#" + formAttribute);
newButtonID = formAttribute + "_hiddenButton";
if (document.getElementById(newButtonID) !== null) {
$("#" + newButtonID).click();
return;
}
code = '<input id="' + newButtonID + '" class="hiddenSubmitButton" type="submit" value="Submit" />';
$(form).append(code);
setTimeout(function () {
$("#" + newButtonID).click();
}, 50);
});我喜欢在表单之外创建按钮，它允许我们更容易地定制设计，我们可以使用这段代码，它将在旧的浏览器上工作，而且浏览器将使用它的HTML表单验证器。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28762128
复制相关文章
相似问题
腾讯云开发者
