鍍金池/ 問答/網(wǎng)絡安全  HTML/ 在contextmenu右鍵事件上js模擬觸發(fā)click,希望通過click事件

在contextmenu右鍵事件上js模擬觸發(fā)click,希望通過click事件獲取焦點,但現(xiàn)象是執(zhí)行右鍵選擇完才獲取焦點

我想實現(xiàn)右鍵功能,像qq這樣,右鍵點擊圖片時,圖片被選中,并通過css focus顯示選中效果,如下圖

clipboard.png


我想通過模擬click事件去觸發(fā)這個效果,使得window.selection有選中內(nèi)容,css也能有選中樣式,但不管我是用click(),還是用dispathEvent事件觸發(fā)。實現(xiàn)效果都是,選擇完右鍵菜單項后,圖片才獲取焦點。
我是vue實現(xiàn)的,我的代碼是:

// img 標簽綁定@contextmenu="rightHandler"
// methods
   rightHandler(e) {
    e.target.click()
    // 或者這個方法
    // e.target.dispatchEvent(new MouseEvent('click', { 'bubbles': true }))
    this.showMenu() // 其他一系列操作
    }

如果直接用dispathEvent('click'), 能先獲取焦點,再顯示右鍵,但是會報錯

clipboard.png
求大神們解救,萬分感謝!

回答
編輯回答
愚念

在“EventTarget”上執(zhí)行“dispatchEvent”失?。旱谝粋€參數(shù)不是“Event”類型

e.target.dispatchEvent(e.target.createEvent( 'click' ))

2018年6月7日 03:22
編輯回答
安若晴

自行解決了,在e.target.click() 之后將顯示菜單欄函數(shù)添加setTimeOut(), 30ms即可
感覺應該有更好的方法,如果有,請?zhí)砑踊卮?,我會采納的,謝謝

2018年4月4日 09:56