85

このような単純な入力フィールドがあります。

<div class="search">
   <input type="text" value="y u no work"/>
</div>​

そして、私はfocus()関数の中でそれをしようとしています。したがって、ランダム関数の内部（関数が何であるかは関係ありません）には、この行があります…</ p> 

$('.search').find('input').focus();

これは、すべてのデスクトップで問題なく機能します。

ただし、iPhoneでは動作しません。フィールドがフォーカスされておらず、iPhoneにキーボードが表示されていません。

テストの目的で、そして皆さんに問題を示すために、私は簡単なサンプルを作成しました：

$('#some-test-element').click(function() {
  $('.search').find('input').focus(); // works well on my iPhone - Keyboard slides in
});

setTimeout(function() {
  //alert('test'); //works
  $('.search').find('input').focus(); // doesn't work on my iPhone - works on Desktop
}, 5000);​

focus()なぜ私のiPhoneのタイムアウト機能で動作しないのか考えてみてください。

ライブの例を見るには、iPhoneでこのフィドルをテストしてください。http://jsfiddle.net/Hc4sT/

アップデート：

現在のプロジェクトで現在直面しているのとまったく同じケースを作成しました。

「変更」したときに、フォーカスを入力フィールドに設定し、iPhoneまたはその他のモバイルデバイスのkexboardにスライドインする必要がある選択ボックスがあります。focus（）が正しく設定されているのに、キーボードが表示されないことがわかりました。キーボードが表示される必要があります。

4

9 に答える 9

83

実は、皆さん、方法があります。[LINK REMOVED] (iPhone または iPad で試してみてください) のためにこれを理解するのに非常に苦労しました。

基本的に、タッチスクリーン デバイスの Safari は、テキスト ボックスの入力に関してはけちfocus()です。一部のデスクトップ ブラウザでさえ、そうするとより良い結果が得られますclick().focus()。しかし、タッチスクリーン デバイスの Safari の設計者は、キーボードが何度も出てくるとユーザーが煩わしいことに気付き、次の条件のみに焦点を当てました。

1) ユーザーがどこかをクリックしfocus()、クリック イベントの実行中に呼び出されました。AJAX 呼び出しを実行している場合は、jQueryの非推奨の (ただしまだ使用可能な) オプションなどを使用して、同期的に実行する必要があります。$.ajax({async:false})

2）さらに、これはしばらくの間私を忙しくさせましたfocus()が、その時点で他のテキストボックスがフォーカスされている場合、まだ機能していないようです。AJAXを実行する「Go」ボタンがあったのでtouchstart、Goボタンのイベントでテキストボックスをぼかしてみましたが、Goボタンのクリックを完了する前にキーボードが消えてビューポートが移動しました. touchend最後に、Go ボタンのイベントでテキストボックスをぼかしてみましたが、これは魅力的でした!

1 番と 2 番を組み合わせると、パスワード フィールドにフォーカスを置くことで、ログイン フォームを粗雑な Web ログイン フォームとは一線を画し、よりネイティブに感じさせる魔法のような結果が得られます。楽しみ！:)

于 2013-05-17T04:14:23.273 に答える
3

このソリューションはうまく機能します。私は自分の電話でテストしました：

document.body.ontouchend = function() { document.querySelector('[name="name"]').focus(); };

楽しい

于 2016-02-12T17:32:48.773 に答える
1

アップデート

私もこれを試しましたが、役に立ちませんでした：

$(document).ready(function() {
$('body :not(.wr-dropdown)').bind("click", function(e) {
    $('.test').focus();
})
$('.wr-dropdown').on('change', function(e) {
    if ($(".wr-dropdow option[value='/search']")) {
        setTimeout(function(e) {
            $('body :not(.wr-dropdown)').trigger("click");
        },3000)         
    } 
});

});

あなたのJSFiddleが正常に動作しているために、これが機能していないとあなたが言う理由について私は混乱していますが、とにかくここに私の提案があります...

クリック イベントの SetTimeOut 関数で次のコード行を試してください。

document.myInput.focus();

myInput は、input タグの name 属性に関連付けられます。

<input name="myInput">

そして、このコードを使用してフィールドをぼかします。

document.activeElement.blur();
于 2012-08-30T20:38:47.443 に答える