.focus() с JQUERY MOBILE?

Я думаю, что фокусное событие не работает с JQuery mobile: вот мой код? что вы думаете об этом и благодарите u.
(когда я удаляю вызов в библиотеку jquery mobile, он работает)

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="#" onclick="location.href='http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css'; return false;" />
        <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.js"></script>
    </head>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#acceuil').live('pagecreate', function(event) {
                $('#declencher').click(function() {
                    $('#cache').focus();
                });
                $('#declencher').trigger('click');
            });
        });
    </script>
    <body>
        <div data-role="page" id ="acceuil" >
            <div data-role="header" data-theme="a" ><h3>aaa</h3></div>
            <div data-role="content">
                <input id="cache" type="input">    
                <input type="button" id="declencher" value="declencher">
            </div><!-- content-->
            <div data-role="footer" data-theme="a" data-position="fixed"><h3> Footer </h3></div>
        </div>
    </body>

</html>

Ответ 1

pagecreate событие срабатывает до того, как JQM внесет некоторые изменения в DOM, поэтому я полагаю, что фокус потерян.

Попробуйте переключиться на pageshow, особенно потому, что вы хотите получить фокус каждый раз, когда пользователь попадает на страницу.

Если он все еще не работает (был такой случай), заверните код, который вызывает фокус в тайм-ауте (да, это взломать:))

setTimeout(function(){
 $('#cache').focus();
},0);

Это взлом, но он не зависит от ожидания временного интервала. setTimeout() добавляет функцию для рендеринга очереди потоков (которая запускает javascript и рендеринг страниц в браузере) по истечении заданного времени. Таким образом, в этом случае функция добавляется мгновенно, поэтому она запускается после завершения текущего потока кода javascript. Таким образом, это способ сделать некоторый код запущен сразу после завершения обработчика события. Так что это не так сложно, как можно подумать. Я называю это взломом, потому что он использует знания о том, как работает браузер, и он скрывает поток выполнения кода.

Я рекомендую прочитать о том, как выполнение javascript и рисование страницы обрабатываются одной и той же очередью в одном потоке. Для любого, кто работает с более чем 20 строками javascript.

Я уверен, что есть только одно лучшее решение - исправить его в самой платформе jQuery Mobile.

Ответ 2

Если вы используете HTML5 затем используйте атрибут автофокуса.

  <body>
    <div data-role="page" id ="acceuil" >
        <div data-role="header" data-theme="a" ><h3>aaa</h3></div>
        <div data-role="content">
            <input id="cache" type="input" autofocus>    
            <input type="button" id="declencher" value="declencher">
        </div><!-- content-->
        <div data-role="footer" data-theme="a" data-position="fixed"><h3> Footer       </h3></div>
    </div>
</body>

Пожалуйста, обратитесь Атрибут автофокуса HTML5

Ответ 3

попробуйте этот, он работает на моем мобильном Safari, Chrome, а также на рабочем столе браузера

// div is some selected element
            var f = function(event) {
                $timeout(function() { // angular way, setTimeout is OK
                    input[0].focus();
                    event.preventDefault();
                })
            };

            var mobile = false;
            div.on('click', function(event) {
                if(mobile) return;
                f(event);
            });

            div.on('touchstart', function(event) {
                mobile = true;
                f(event);
            });

            div.on('touchend', function(event) {
                event.preventDefault();
                event.stopPropagation();
            });

Ответ 4

В вашем UIWebView установите для клавиатурыDisplayRequiresUserAction значение NO.

Если вы используете использование Кордовы или Phonegap, в вашем файле config.xml добавьте следующее:

<preference name="KeyboardDisplayRequiresUserAction" value="false"/>

Ответ 5

Это еще один вариант, а не точное решение, это может служить цели в случае, если вышеупомянутые решения не работают.

При нажатии на ссылку "Продажи" фокус переходит на отказ от продажи, здесь в этом случае смещение должно быть указано в соответствии с вашим требованием.

<div class="sales">
    <a href="#sales-disclaimer" onclick="setFocusToSales()">
        Sales
    </a>
</div>

<div id='sales-disclaimer'>
    some text here........
</div>

/Функция Javascript/

function setFocusToSales()
{
    $('html, body').animate({
        scrollTop: $('#sales-disclaimer').offset().top
    }, 1000);
}

Ответ 6

решена

$( document ).on( "pageshow", "#casino", function( event ) {
    var txtBox=document.getElementById("SearchUsuario");
    txtBox.tabindex=0; //this do the trick
    txtBox.value="";
    txtBox.focus();
});