submit: <binding-function>
优质
小牛编辑
131浏览
2023-12-01
此绑定用于在提交关联的DOM元素时调用JavaScript函数。 此绑定主要用于表单元素。
使用提交绑定时，表单实际上不会提交给服务器。 KO阻止浏览器默认操作。 如果您希望提交绑定作为真正的提交元素，则从处理函数返回true。
语法 (Syntax)
submit: <binding-function>
参数 (Parameters)
这里的绑定函数将是在提交事件后需要调用的main函数。
这个函数可以是任何JavaScript函数，也不一定是ViewModel函数。
例子 (Example)
让我们看一下下面的示例，该示例演示了如何使用提交绑定。
<!DOCTYPE html>
<head>
<title>KnockoutJS Submit Binding</title>
<script src = "https://ajax.aspnetcdn.com/ajax/knockout/knockout-3.3.0.js"
type = "text/javascript"></script>
</head>
<body>
<form data-bind = "submit: addition">
<p>Enter first number: <input data-bind = "value: var1" /></p>
<p>Enter second number: <input data-bind = "value: var2" /></p>
<p><button type = "submit" >Click here for addition</button></p>
</form>
<script type = "text/javascript">
function ViewModel () {
self = this;
self.var1 = ko.observable(10);
self.var2 = ko.observable(30);
self.var3 = ko.observable(0);
this.addition = function() {
self.var1(Number(self.var1()));
self.var2(Number(self.var2()));
this.var3 = self.var1() + self.var2();
alert("Addition is = "+ this.var3 );
};
};
var vm = new ViewModel();
ko.applyBindings(vm);
</script>
</body>
</html>
输出 (Output)
让我们执行以下步骤来查看上述代码的工作原理 -
将以上代码保存在submit-bind.htm文件中。
在浏览器中打开此HTML文件。
该程序增加了2个数字。 在KO中，默认情况下，来自UI的任何接受的数据都被视为字符串格式，因此在数字操作的情况下需要将其转换为数字格式。
请参阅点击装订以获取附加说明，例如传递额外参数等。该页面上的所有注释也适用于提交装订。