1

注意: 此问题基于旧版本的 Mozilla x-tag。

在我的项目中,我使用的是Mozilla x-tag。我创建了这个名为 x-master 的标签。我的 index.html 中有两个这样的标签:

<div id="page-one" data-role="page">
<x-master id="x-one" data-src="source1"></x-master>
</div>
<div id="page-two" data-role="page">
<x-master id="x-two" data-src="source2"></x-master>
</div>

xtag 组件如下所示:

(function(window, document, undefined) {
var jsonurl;

xtag.register('x-master', {
onCreate : function() {
jsonurl = this.getAttribute('data-src');
},
methods : {
getContent : function(){
$.getJSON(jsonurl, function(data){ console.log(jsonurl); };
}
}
})(this, this.document);

我的问题: 当我为 id x-one 调用 getContent 方法时,它会打印:source2. 我怎样才能防止这种行为?

4

4 回答 4

3

我建议使用最新版本的 X-Tag - 规范在标准化过程的后期阶段发生了变化,该版本已经很旧了。现在为 X-Tag 提供的 API 将与最终规范兼容,并且现在可以在所有主要浏览器中使用,一直到 IE9:http: //x-tags.org/

以下是使用 X-Tag 的内置功能优化后的代码:

xtag.register('x-master', {
    accessors: {
        src: {
            attribute: {},
            set: function(src){
                // Using the attribute <--> accessor auto-linkage feature of 
                // X-Tag, both your created lifecycle event and getContent method
                // become unnecessary. If src is present on creation, or changed
                // at any time, your setter is automatically executed. Simply set
                // the src property/attribute and it will do your AJAX call.
                $.getJSON(src, function(){ ... })
            }
        }
    }
});
于 2013-05-14T15:31:12.837 回答
2

在这部分:

onCreate : function() {
jsonurl = this.getAttribute('data-src');

每次 x-master 初始化时,jsonurl 都会从当前 x-master 分配一个值。这就是为什么你总是得到最后一个元素的 data-src 的原因。

于 2012-12-24T15:12:26.760 回答
2

使jsonurl对象的 a 属性,而不是所有 x-master 共享的变量。

var props = function() {
    var jsonurl;

    return { 
        onCreate: function() {
            jsonurl = this.getAttribute('data-src');
        },

        methods: {
            getContent: function() {
                $.getJSON(jsonurl, function(data) {
                    console.log(jsonurl);
                };
            }
        }
    };
};

xtag.register('x-master', props());
于 2012-12-24T15:19:21.840 回答
2

解决这个问题的方法是使用 jsonurl 创建一个对象。感谢Florian Margaine让我找到了正确的解决方案。

这该怎么做:

(function(window, document, undefined) { 
function props() {
    this.jsonurl; 
}

xtag.register('x-master', {
    onCreate : function() {
       this.props = new props();
       this.props.jsonurl = this.getAttribute('data-src');
},
    methods : {
        getContent : function(){
             $.getJSON(this.props.jsonurl, function(data){ console.log(jsonurl); };
        }
}
})(this, this.document);
于 2013-01-02T10:14:31.770 回答