我有一个Dojo对话框，里面有一个表单，文本框和按钮。
当窗体打开时，我在文本框中输入一些东西并按Enter键，整个网站重新加载。
我该如何预防?单击OK按钮按预期工作。是否有一种方法可以禁用Enter行为?
var form = new Form();
new TextBox({
placeHolder: "enter value:"
}).placeAt(form.containerNode);
new Button({
label: "OK",
'onClick': function () {
console.log(`form value is: ${form._descendants[0].value}`)
dia.hide();
},
}).placeAt(form.containerNode);
var dia = new Dialog({
content: form,
title: "Save",
style: "width: 300px",
});
form.startup();
dia.show();
默认情况下，表单在我们点击enter时提交，为了防止这种情况，你必须监听提交事件，并通过使用event. preventdefault ()
来防止默认的浏览器动作添加上述代码将解决您的问题:
form.on("submit", function(e){
e.preventDefault();
})
见下面的工作代码片段:
require(["dijit/Dialog", "dijit/registry", "dojo/ready", "dijit/form/Button", "dijit/form/Form" , "dijit/form/ValidationTextBox"],
function(Dialog, registry, ready, Button, Form, ValidationTextBox) {
ready(function() {
var form = new Form();
new ValidationTextBox({
name:"textValue",
required:true,
placeHolder: "enter value:"
}).placeAt(form.containerNode);
new ValidationTextBox({
name:"otherTextValue",
required:true,
placeHolder: "enter value:"
}).placeAt(form.containerNode);
new Button({
label: "OK",
type:"submit"
}).placeAt(form.containerNode);
var dia = new Dialog({
content: form,
title: "Save",
style: "width: 300px",
});
form.on("submit", function(e){
e.preventDefault();
if(form.validate()) {
console.log(form.get("value"))
dia.hide()
}
})
form.startup();
dia.show();
registry.byId("btn").on("click", function() {
form.reset();
dia.show();
});
});
}
);<script type="text/javascript">
dojoConfig = {
isDebug: true,
async: true,
parseOnLoad: true
}
</script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css" rel="stylesheet" />
<body class="claro">
<div data-dojo-type="dijit/form/Button" id="btn"> show again </div>
</body>