KnockoutJS - 提交绑定

此绑定用于在提交相关 DOM 元素时调用 JavaScript 函数。此绑定主要用于表单元素。

使用提交绑定时，表单实际上并未提交到服务器。KO 可防止浏览器的默认操作。如果您希望提交绑定作为真正的提交元素工作，则从处理程序函数返回 true。

语法

submit: <binding-function>

参数

此处的绑定函数将是提交事件后需要调用的主要函数。
此函数可以是任何 JavaScript 函数，不一定是 ViewModel 函数。

示例

让我们看看以下示例，该示例演示了提交绑定的使用。

<!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>