当前位置：首页 → 问答吧 → $(e[0].target); //实在看不懂,那位达人可否告知?

$(e[0].target); //实在看不懂,那位达人可否告知?

时间：2009-04-24

来源：互联网

<!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" >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>通用型下拉框</title>
    <script type="text/javascript" src="core/jquery.js"></script>

    <script type="text/javascript">
    //[email protected]
//by 令狐葱
// 扩展Function对象
Function.prototype.bind = function(scope, args){
    var method = this;
    if(args === undefined){
        args = [];
    }
    return function() {
//        for(var i=0;i<arguments.length;i++)
//        alert(arguments);
        return method.apply(scope, args.concat(arguments));
    }

}
//联动下拉框
//config: {url:xml路径,el:父容器ID,root:根节点名,field:子节点名,text:显示文本,value:值}
//xml文件格式：<root><list id='' text=''></list></root>
linkSelect = function(config){
    this.conf = config;
    this.el = $('#' + config.el);
    this.init();
}
var i=0;
linkSelect.prototype = {
        init: function(){
        this.el.append('加载中...');
        $.get('xml/area.xml', this.callback.bind(this));
    },

        callback:function(result){
        this.data = $(result).find(this.conf.root);
        this.el.empty();
        this.create(this.data.children());
    },

     create:function(data){
        if(data.length == 0){return false;}
        var select = $('<select style="width:65px"></select>').appendTo(this.el).change(this.change.bind(this));
        var text = this.conf.text;
        var value = this.conf.value;
        data.each(function(){
            var option = $('<option value='+$(this).attr(value)+'>'+$(this).attr(text)+'</option>').appendTo(select);
        });
        select.change();
    },

    change:function(e){
        var select = $(e[0].target); //实在看不懂,那位达人可否告知?
        var value = select.val();
        var data = this.data.find(this.conf.field+'['+this.conf.value+'='+value+']').children();

        this.remove(select);
        this.create(data);
this;
    },

    remove: function(el){
        var next = el.next('select');
        if(next.length > 0){
            next.remove();
            this.remove(el);
        }
    }
};

        $(document).ready(function() {
         var selects = new linkSelect({
             el: 'selects',
                root: 'root',
                field: 'list',
                text: 'Text',
                value: 'ID'
             });
function abc(){alert("")};
$("#btn").bind("click", function(){abc();});
var test= new Object();
test.attar={
a:1,
al:function(){ alert(this.a);}
}
test.attar.al();
        });
    </script>
</head>
<body>
    <p><b>通用性无限制联动下拉框</b></p>
    <br />
    <div id="selects"></div>
    <input type="button" id="btn"/>
</body>
</html>

作者: seekarmor 发布时间: 2009-04-24

target 事件属性

定义和用法
target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。

语法
event.target

作者: ggcall 发布时间: 2009-04-24

那e[0].target作何解呀?

作者: seekarmor 发布时间: 2009-04-24

就是得到当前select的option集合中当前的dom对象

作者: ggcall 发布时间: 2009-04-24

引用

引用第3楼ggcall于2009-04-24 14:09发表的 Re:$(e[0].target); //实在看不懂,那位达人可否告知? :
就是得到当前select的option集合中当前的dom对象

那它为什么要用e[0].target,而不用e.target呢????.
我试过了,换成e.target就出错!!

作者: seekarmor 发布时间: 2009-04-24