input 沒法獲取焦點

父元素進行拖拽，子元素 input 框沒法獲取焦點，還有一種狀況是定位到拖拽元素的上邊的 input 框也沒法獲取焦點

一、對於點擊事件，是按照 mousedown -> mouseup -> click 這個順序走的

二、對於focus 事件， 是按照 mousedown -> focus -> mouseup -> click 順序。 因此在 mousedown 的時候是獲取不到 focus 事件的

爲了你們能看懂先後的代碼貼出來一些簡單封裝的方法

// 綁定事件 兼容處理
    export const addEvent =  (nodeId, eventType, callback) => {
        if (nodeId.addEventListener){
            nodeId.addEventListener(eventType, callback, false);
        }else {
            nodeId.attachEvent('on' + eventType, callback);
        }
    }
    // 判斷 event 事件對象 不存在
    export const prevent = (event) => {
        let e = event || window.event;
        if (e.preventDefault) {
    		e.preventDefault();
        }
        return e;
    }
複製代碼

在使用 mousedowm 事件的時候 有event 事件對象，咱們能經過 event.target 能獲取當前目標對象，若是 enent.target.nodeName 是 INPUT 的時候咱們手動讓input獲取焦點，

我實現的功能是拖動父元素讓子元素移動，由於還有縮放功能不能直接添加到元素上由於會縮放的很小shi時候，滾輪和拖拽 都不能獲取到事件了。

打個比方： 把拖拽 和 縮放事件放在body 上，可是移動和縮放的是子元素。

/*拖拽功能*/
    export default (nodeId) => {
        var oParent = nodeId.parentNode;
        addEvent(oParent, 'mousedown', function(ev) {
            var oEvent = prevent(ev);
            if(oEvent.target.nodeName.toLowerCase() === 'input'){ //若是目標元素是input則跳出滑動事件
                oEvent.target.focus()
                return;
            }
            ......
            // 若是 目標元素是 input 的話 下邊的邏輯就不會處理
        })
    }
複製代碼

還有一個重點是關於內存消耗的，咱們都知道每當拖動一次就會註冊 一次 mousedowm 事件，這樣就會形成內存的泄露，因此在mouseup 的時候須要刪除事件的這裏就不重點說了。

removeEvent(oParent, 'mousemove', startMove);
    removeEvent(oParent, 'mouseup', endMove);
複製代碼