iOS觸摸事件通過DOM插入

Question

在iPad上的移動Safari和iOS UIWebView中我看到以下行爲。

我有一個頁面，使用JavaScript替換DOM元素的內容。第一頁有一個按鈕，當按下按鈕將從容器元素中刪除所有元素，並將一組新的html插入到容器中。

問題是，當按鈕被按下並且html被切換出來時，觸摸事件會通過新插入的html頁面。在我的情況下，我們在第二頁上的文本輸入與第一頁上的按鈕位置相同。所以，當按下按鈕時，觸摸事件將通過並將焦點放在文本輸入上，並彈出軟鍵盤。

有沒有人有關於爲何發生這種情況的詳細信息，或者我可以如何防止此問題或此問題的任何解決方法？

在iPad上查看下面的鏈接，你會看到我在說什麼。它似乎沒有發生在「點擊」事件上，但「touchstart」和「touchstop」使這種情況發生。

http://jsfiddle.net/tcollins/BtmyD/embedded/result/

HTML

<h3>Touch Start</h3> 
<div id="container2"> 
    <button id="theButton2">Press Me</button> 
</div> 

JAVASCRIPT

$('#theButton2').bind('touchstart', function(){ 
    var html = '<input type="text">'; 
    $('#container2').empty().append(html); 
}); 

Answer 1

您是否嘗試過加入您的追加前evt.preventDefault();和evt.stopPropagation();？ 像這樣：

 

    $('#theButton2').bind('touchstart', function(evt){ 
     evt.preventDefault(); 
     evt.stopPropagation(); 
     var html = ''; 
     $('#container2').empty().append(html); 
    }); 

可悲的是，我沒有一個iPhone，所以我考粗野，它，但它應該從傳播停止該事件。