Question

我有两个函数添加到jQuery本机方法，并使用jquery data（）方法存储信息以检索后者。

如果属性已存储，我不想存储该属性。

所以我有：

$.fn.foo = function() {
    if(!$.hasData(this)) {
        $.data(this, 'width', this.css('width'));
        $('#test').append('foo : Added to "data"<br>');
    }
}
$.fn.bar = function() {
    if(!$.hasData(this)) {
        $.data(this, 'width', this.css('width'));
        $('#test').append('bar : Added to "data"<br>');
    }
}

$('element').foo();
$('element').bar();

但它输出＆＃34;添加到数据＆＃34;两次，而不是一次。似乎$ .data（）根本不会在全球范围内采取行动。我应该如何调整代码以使数据表现为全局？

这里是jsfiddle：http://jsfiddle.net/e9e9vbnn/

Answer 1

$.data()将dom元素引用作为其第一个参数，而不是jQuery对象。在插件方法this内部将引用被调用的jQuery包装器对象，而不是dom元素引用。

＆＃13;

$.fn.foo = function() {
  //also return this to maintain chanability
  return this.each(function() {
    if (!$.hasData(this)) {
      $.data(this, 'width', $(this).css('width'));
      $('#test').append('foo : Added to "data"<br>');
    }
  })
}
$.fn.bar = function() {
  return this.each(function() {
    if (!$.hasData(this)) {
      $.data(this, 'width', $(this).css('width'));
      $('#test').append('bar : Added to "data"<br>');
    }
  })
}

$('#element').foo();
$('#element').bar();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id='test'></div>
<div id='element'></div>

＆＃13;

jQuery data（）并不全局工作

1 个答案: