当前位置：首页 → 问答吧 → jQuey.fn.extend读取私有变量的问题

jQuey.fn.extend读取私有变量的问题

时间：2010-01-31

来源：互联网

$.fn.goods = function(options){
var defaults = {
serverId: 5,
itemId: 0,
itemName: null,
tradeType: null,
enchant: null,
inited: false,
enabled: false,
updatedAt: Math.round(new Date().getTime()/1000),
count: 0,
interval: 3000,
data: {}
};
var settings = $.extend(defaults, options || {});
var goodsObj = this;

_initialize();

$.fn.getValue = function(key){
if(typeof key == 'string') return eval('settings.' + key);
else return settings;
};
$.fn.setValue = function(key, value){
if(typeof key =='string' && typeof value != 'undefined') return eval('settings.' + key + ' = ' + value);
};
/**
* 初始化插件对像
*/
function _initialize(){
if(!settings.inited){
settings.inited = true;
//首次更新
if(settings.enabled){
_updateStatus();
var updating = setInterval(function(){_updateStatus()}, settings.interval);
}
}
}
/**
* 弹出所有配置信息
*/
function alertSettings(){
var str = '';
for(e in settings) str += e + " = " + settings[e] + "\n";
str += "离上次更新已过:" + (Math.round(new Date().getTime()/1000) - settings.updatedAt) + "秒";
alert(str);
return false; // Avoid the browser following the link
}

if(settings.inited) return this.unbind('click').click(alertSettings);
}

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
一串dom在持行$("ul li").goods({省略参数N})后，各自有私有的settings，但是使用$(dom).getValue和$(dom).setValue时，无轮点哪个li只能得到最后一个li的settings值，类似于这个settings是公有属性。而我想要访问各自的私有属性，该怎么做？

[ 此帖被paull在2010-02-05 17:13重新编辑 ]

作者: paull 发布时间: 2010-01-31

$("ul li")得到的是多个对象吧，但是这个插件里并没有逐个操作吧
应该这样调用吧
$.each($("ul li"),function(i,n){
$(n).goods();
});

作者: ywqbestever 发布时间: 2010-01-31

之前那个只有第一个有效。
用了这种后，只有最后一种有效。郁闷
$("ul li").each(function(){
$(this).goods({参数});
});

作者: paull 发布时间: 2010-01-31

用data吧
给你个例子：

复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Untitled Page</title>
<script type="text/javascript" src='http://code.jquery.com/jquery-1.4.1.min.js'></script>
<script type="text/javascript">
//<![CDATA[
(function($) {
$.fn.goods = function(options){
var defaults = {
innerHTML: '',
last_update : ''
};
var settings = $.extend({}, defaults, options);
var obj = $(this);
settings.innerHTML = $(this).html();
settings.last_update = Math.round(new Date().getTime()/1000);
obj.data('settings',settings);
$.fn.getHTML = function(){
var o = $(this).data('settings');
return 'html:' + o.innerHTML + "\n last_update:" + o.last_update;
}
$.fn.setHTML = function(html){
if(!html){
alert('give me a argument');
}else{
$(this).html(html);
$(this).data('settings').innerHTML = html;
$(this).data('settings').last_update = Math.round(new Date().getTime()/1000);
}
}
}
})(jQuery);
$(document).ready(function(){
$('ul li').each(function(){
$(this).goods();
$(this).click(function(){
alert($(this).getHTML());
});
});
});
//]]>
</script>
</head>
<body>
<ul>
<li>this is one,click me</li>
<li>this is two,click me</li>
<li>this is three,click me</li>
</ul>
<a href='#' onclick="$('ul li:first').setHTML('i am changed,click me !')">改变第一个LI的HTML</a>
</body>
</html>