使用以下三行代码就可以使用模拟鼠标事件了

var oCreateEvt = $D.createEvent('MouseEvents');//模拟鼠标对象
oCreateEvt.initMouseEvent('click',true,true,document.defaultView,0,0,0,0,0,false,false,false,false,0,null);

$(id).dispatchEvent(oCreateEvt);

比较方便的应用可以利用模拟鼠标事件写一个键盘操作系统,具体实现

数据结构:
var oKeycombination = [//非组合键不会阻止默认事件
            {page:'',key:'esc',id:'',desc:'esc键,取消光标'},
            {page:'',key:'m',id:'zc_person_index_market',desc:'市场页面'},
            {page:'',key:'n',id:'zc_person_news',desc:'新闻'},
            {page:'',key:'c',id:'zc_person_chat',desc:'聊天'},
            {page:'',key:'s',id:'left_feedBack',desc:'意见'},
            {page:'',key:'f',id:'table_furl',desc:'收放'},
            {page:'',key:'1',id:'person_type1',desc:'1'},
            {page:'',key:'2',id:'person_type2',desc:'2'},
            {page:'',key:'3',id:'person_type3',desc:'3'},
            {page:'',key:'4',id:'person_type4',desc:'4'},
            {key:'ctrl+1',id:'common_chat',page:'chat',desc:'chat页面切换标签'},
            {key:'ctrl+2',id:'private_chat',page:'chat',desc:'chat页面切换标签'},
            {key:'ctrl+1',id:'hotNews',page:'news',desc:'news页面切换标签'},
            {key:'ctrl+2',id:'news_final',page:'news',desc:'news页面切换标签'},
            {key:'ctrl+3',id:'news_base',page:'news',desc:'news页面切换标签'},
            {key:'shift+1',id:'market_tab1',page:'market',desc:'market页面切换标签'},
            {key:'shift+2',id:'market_tab2',page:'market',desc:'market页面切换标签'},
            {key:'shift+3',id:'market_tab3',page:'market',desc:'market页面切换标签'},
            {key:'shift+4',id:'market_tab4',page:'market',desc:'market页面切换标签'},
            {key:'ctrl+1',id:'canvas_chart1',page:'canvas',desc:'canvas1图'},
            {key:'ctrl+2',id:'canvas_chart2',page:'canvas',desc:'canvas4图'},
            {key:'ctrl+3',id:'canvas_chart3',page:'canvas',desc:'canvas9图'},
            {key:'ctrl+4',id:'canvas_chart4',page:'canvas',desc:'canvas16图'},
            {key:'ctrl+5',id:'canvas_chart5',page:'canvas',desc:'canvas25图'}
        ];

方法:
    function combinationKey(key,page,id){//键盘事件
        WT.key(key, function(e){
            e=WT.e.fix(e);
            if (page.length > 0) {
                  e.stop();
            }
              if (key === 'esc') {
                  clearList(e);
                clearTips(e);
                document.activeElement.blur();
              }else if(document.activeElement.tagName === 'BODY' && window.location.hash.indexOf(page)>-1 && id){
                  $(id).dispatchEvent(oCreateEvt);
              }else if (document.activeElement.tagName === 'BODY' && id){
                  $(id).dispatchEvent(oCreateEvt);
              }
        });
    }

for(var i=0; i<oKeycombination.length; i++){
            combinationKey(oKeycombination[i].key,oKeycombination[i].page,oKeycombination[i].id);
        }
View Code

注意:

1 需要模拟的元素的事件引用需要在你当前加载的页面才有效

2 需要模拟的元素不方便取到可以放在隐藏的元素中。

3 使用组合键时可能需要阻止默认事件,注意阻止默认事件的处理应该在keydown时处理,不然会没有效果。

4 当前focus元素如果是输入框,可以将鼠标焦点调至document.body

posted on 2016-07-11 07:08  lvsally  阅读(723)  评论(0编辑  收藏  举报