将 class/object->function() 调用插入 onsubmit 事件

Question

我正在尝试更改表单上的默认提交操作。提交现在由原型 js 对象-> 函数控制。

     <form action="" method="post" id="product_composite_configure_form" enctype="multipart/form-data" onsubmit="productConfigure.onConfirmBtn(); return false;" target="product_composite_configure_iframe">

我正在使用以下 javascript (jquery) 来更改默认提交操作。我的目标是在 onsubmit 侦听器中插入一个不同的函数。

primaMakeOrder.prototype = {
    constructor: primaMakeOrder,

    start: function(response){

        this.storeOptions();
    },

     storeOptions: function(){
        $j("#product_composite_configure_form").attr("onsubmit",this.saveOptions());
    },

    saveOptions: function(){
        console.log('this is a test')
    }
 }

 $j(document).ready(function($j) {
    primaMakeOrder = new primaMakeOrder();
    primaMakeOrder.start();
});

在这里提交一个值并不难，让它执行一个基于此的函数也很简单。我遇到的问题是让它执行 class 对象中的函数，特别是 primaMakeOrder.saveOption()。问题似乎与实例化有关，但这并不完全正确，因为 javascript 本身有效。

我尝试单独添加 - primaMakeOrder.saveOptions() 和 saveOptions() 但这不起作用。理想情况下，我想要一个可以从 javascript 文件执行的解决方案，而不是在包含

之类的标记上执行的解决方案

  primaMakeOrder = new primaMakeOrder();
  primaMakeOrder.saveOptions();

*旁注 - 我知道同时使用原型和 jquery 可能看起来很奇怪。这是一个更大的应用程序的一部分，这样做是有原因的。另外，我的术语可能有点不对，所以很抱歉，我不太懂 js 编码。

*阅读 - 在发布这篇文章之前，我环顾了 google 一下，一切似乎都暗示了以下格式

  class.function()

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects http://www.mrspeaker.net/2009/10/28/using-jquery-on-javascript-objects/ http://www.htmlgoodies.com/beyond/javascript/calling-object-methods-in-javascript.html

我的要求似乎确实有点不同，我正在努力寻找其他人回答我的确切问题

Answer 1

您覆盖了所有变量范围！我猜 primaMakeOrder 已被定义为全局变量。因此，当您尝试使用 primaMakeOrder = new primaMakeOrder(); 重新分配它时，引用会丢失并且您取回的对象具有与您想象的不同的原型。

我建议提供一些作用域并避免使用全局变量。我还建议更改您的原型编码风格。对象字面量可能会造成混淆并产生意想不到的副作用（主要是结束原型链）。

(function() {
  // Wrap your code in an IIFE
  function PrimaOrder() {
    // this is your constructor
  }

  PrimaOrder.prototype.saveOptions = function() {
    // here is your saveOptions function on every PrimaOrder instance.
  };

  $(function() {
    // Use var to prevent making global variables
    var myPrimaOrder = new PrimaOrder();
    // Notice I use a different name. PrimaOrder is the variable that is
    // the "class" while myPrimaOrder is an "instance".
    myPrimaOrder.saveOptions();
  });
})(); // IIFE's require a trailing ()
// Search Google for Immediately Invoked Function Expression.

将 class/object->function() 调用插入 onsubmit 事件

Insert class/object->function() call into onsubmit event

javascript

jquery

class

function

object