jquery - 親が表示された後、iOS の VoiceOver が子要素にフォーカスを与えない

Question

ユーザーがボタンをタップして、デフォルトで非表示になっているコンテンツの表示を切り替えるモバイル Web ページを開発しています。簡単な例を次に示します。

<div role="button" id="button1">Show Link 1</div>

<div style="display:none" id="div1">
    <a href="#" id="link1">Link 1</a>
</div>

#button1 をタップして非表示の div を表示し、リンク 1 にフォーカスを置きます。JQuery コードは次のとおりです。

$(document).ready(function() {      
    $('#button1').click(function() { 
        $('#div1').show(function() { 
            $('#link1').focus();
        })
    });
});

通常、これは機能します。CSS を使用して :focus に赤い境界線を追加したので、リンクが表示された後にリンクがフォーカスを受けていることがわかります。ただし、リンクがフォーカスを受け取ると、iOS の VoiceOver はそれを通知しません。VoiceOver のフォーカスはボタンに残ります。(これは、iOS 4.3.3 を実行する iPad と iOS 5.1.1 を実行する iPhone 4S でテストしました)。

上記のシナリオとは対照的に、フォーカスを受け取る要素が表示された要素と同じ場合、すべてが正常に機能し、VoiceOver は新しくフォーカスされたリンクをアナウンスします。動作するシナリオの例を次に示します。

<div role="button" id="button2">Show Link 2</div>

<div>
    <a style="display:none" href="#" id="link2">Link 2</a>
</div>

$(document).ready(function() {      
    $('#button2').click(function() { 
        $('#link2').show().focus();
    });
});

その要素が表示されたばかりの要素の子である場合、VoiceOver に新しくフォーカスされた要素を通知させるにはどうすればよいですか?