0

我正在尝试将 JavaScript 原型与 jQuery 的.data()函数一起使用。我的代码如下所示：

el = this.element;

el.data("state", {
   someValue: null,
   anotherValue: function() {
      this._val = 0;
   }
});

el.data("state").anotherValue.prototype.getValue = function() {
   return this._val;
}

el.data("state").anotherValue.prototype.setValue = function(val) {

   if (val === Infinity || val < 1) {
      this._val = 1;
   } else {
      this._val = val;
   }

}

console.log(el.data("state").anotherValue.getValue());

这似乎不起作用，我只是想知道为什么？

运行此代码时得到的结果是：

Uncaught TypeError: Object function () {
   this._val = 0;
} has no method 'getValue'

我正在开发一个基于小部件工厂的 jQuery 插件，我想在这个插件中构建一个可管理的状态机 - 我可以存储和访问插件当前状态的中心位置。我想尝试这个的原因之一是我希望能够监控某些值是否发生变化并在它们发生变化时触发其他事情。我需要使用 .data() 函数存储数据，因为它必须绑定到元素。否则，当您在同一页面上获得插件的多个实例时，会发生奇怪的事情。

4

1 回答 1

0

原型似乎不是去这里的方式。相反，我将尝试使用setters 和 getters。我不能 100% 确定浏览器的兼容性，但是当上面的示例被重写时，代码如下所示：

el = this.element;

el.data("someValue", { 
   val: null,
   get value() { return this.val; },
   set value(val) { 
      if (val === Infinity || val < 1) {
         this.val = 1;
      } else {
         this.val = val;
      }
});

console.log(el.data("someValue").value);
el.data("someValue").value = 0;
console.log(el.data("someValue").value);

如果您运行此代码，您将获得以下输出（在 Google Chrome 中）：

null
10

当以这种方式实现时，我可以运行检查并在变量的值被更改或访问时使事情发生。请记住，这是初步代码 - 我没有时间在多个平台上的多个浏览器中运行它。阅读这篇博文，似乎 IE8 存在浏览器兼容性问题。

于 2012-10-08T08:07:12.983 回答