Как установить курсор в текстовое поле на странице init

Я делаю мобильное приложение в jQuery mobile. Когда первая страница загружается, у нее есть функция init. Мое требование состоит в том, что при загрузке первой страницы курсор должен указывать на текстовое поле. Я пробовал:Как установить курсор в текстовое поле на странице init

$('#txtdemo').focus();

var txtBox=document.getElementById("txtdemo"); 
    txtBox.focus();

но оба не работают. Пожалуйста, дайте мне знать хороший подход, чтобы сделать это.

источник

2013-07-12 vinitha sreevijay

Вы пытались поместить вызов .фокус в setTimeout со временем, скажем, 200? – Jeff

@vinithasreevijay, я думаю, что вы не можете сделать это, потому что это может быть похоже на то, что поле ввода «txtdemo» может быть недоступно в функции init. –

Когда я даю фокус(), текстовое поле выбирает, но проблема в том, что курсор не указывает на текстовое поле –

В мобильной версии сайта, невозможно сосредоточиться в текстовом поле и открытой клавиатуре с помощью программирования. это один из способов использования юзабилити. На рабочем столе вы можете сделать это с помощью

$('#txtdemo').focus(); 

$('#txtdemo').select(); 

$('#txtdemo').trigger('focus'); 

$('#txtdemo').trigger('click');

источник

2013-07-12 10:49:34

Спасибо Dipen ... Это работает для меня –

@vinit hasreevijay - ur welcome –

Это можно сделать только в течение pageshow Событие. Он должен быть pageshow потому что страница полностью сформирована только в этой точке. Если вы не знаете, что pageshow взгляните на мои СТАТЬЯ относительно jQuery События для мобильных страниц. Кроме того, это будет работать только в настольных браузерах, но это не будет работать на мобильных браузерах. В случае, когда поле ввода мобильных браузеров будет находиться в фокусе, это не вызовет показ клавиатуры.

$(document).on('pageshow', '#index', function(){ 
    $('#some-input').focus(); 
});

Рабочий пример:

<!DOCTYPE html> 
<html>http://jsfiddle.net/Gajotres/PMrDn/#update 
    <head> 
     <title>jQM Complex Demo</title> 
     <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> 
     <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 
     <script> 
      $(document).on('pageshow', '#index', function(){ 
       $('#some-input').focus(); 
      }); 
     </script>  
    </head> 
    <body> 
     <div data-role="page" id="index"> 
      <div data-theme="b" data-role="header"> 
       <h1>Index page</h1> 
      </div> 

      <div data-role="content"> 
       <input type="text" value="" id="some-input"/> 
      </div> 
     </div>  
    </body> 
</html>

источник

2013-07-12 10:43:19 Gajotres

Здесь также не указывается на текстовое поле –

Какой браузер вы используете? Мои примеры были протестированы на Firefox, Chrome и IE9, и он работает во всех них. – Gajotres

Chrome .. но он не работает для меня –

Как установить курсор в текстовое поле на странице init

ответ

Смежные вопросы