H5移動端頁面加入canvas可滑動代碼條件下android手機點擊input重複彈出鍵盤

在移動端頁面使用canvas的動畫，爲了實現動畫的觸摸滑動，會加入createjs.Touch.enable(stage, true, false)這條語句，但加入這條語句後，頁面的input和click等可點擊事件都會失效，因此會用觸摸事件來實現相關功能，以下：

$('#button').on('touchstart', function() {
    window.location.href = 'xx.html'
})

觸摸事件控制焦點的獲取來使input鍵盤彈出：

$('#input').on('touchstart', function() {
    $(this).focus()
})

然而蘋果手機鍵盤關閉後input焦點自動失去，再次點擊鍵盤彈出無異常，安卓手機鍵盤關閉input仍是獲取焦點狀態，故鍵盤沒法重複彈出。本想在關閉鍵盤的事件上加個失去焦點的行爲，但查過資料沒法找到這個事件，因此另闢奇徑，找到了另外一種辦法：每次點擊input都會刪除原來的input而且生成新的input放在這裏，這樣新的input又能夠獲取焦點並彈出鍵盤了，實現代碼以下：

html代碼：

<button id="btn"></button>
<div class="box">
    <input type="text" maxlength="4" id="hengpi"/>
</div>

js代碼：

$('#btn').on('touchstart', function() {
    var value = $('input').val()
    $('input').remove()
    $('.box').html('<input type="text"/>')
    if(value!=''){
        $('input').val(value)
    }
    $('input').focus()
})