Программно задайте фокус поля ввода из события ListView ItemInvoked [Windows 8 Metro HTML5]

Изменить: Если вы еще не разработали Windows 8, не пытайтесь ответить на этот вопрос. Не голосуйте по этому поводу. Даже не читал. Это не веб-приложение или веб-сайт и не запускается в браузере. Пожалуйста, остановите контент для голосования, который вы не понимаете. Это приложение Windows 8 METRO HTML5/js, работающее в среде выполнения Windows.

Оригинальный вопрос:

Я хочу, чтобы курсор был "мигал" в поле ввода, готовый для приема ввода. Я использую javascript для установки фокуса. Это не работает:

document.querySelector("#input-box").focus();

Кто-нибудь знает почему? Не подходит ли метод фокуса для этого?

Спасибо.

Изменить # 2:. Это определенно имеет отношение к тому факту, что я пытаюсь настроить фокус на вход из события ListView "itemInvoked". Событие срабатывает правильно, элемент доступен из обработчика события, а строка не имеет ошибок при выполнении. Я могу настроить фокус на свой тег ввода из стандартного события нажатия кнопки, но не из события ItemInvoked. Итак, вопрос в том, почему я не могу настроить фокус из этого обработчика событий?

Ответ 1

Я создал этот небольшой тестовый проект только с текстовым полем, а в onload задал фокус точно так же, как и вы. Я попробовал это как на эмуляторе, так и на моей локальной машине, и оба метода работают.

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

Вы можете скачать образец здесь http://www.playingwith.net/Temp/TestFocusApplication.zip

Обновление

Хорошо, похоже, нашел это, если вы вызываете функцию msSetImmediate с функцией, которая устанавливает фокус в текстовое поле, похоже, она работает. У меня нет возможности загрузить тестовый пример, поэтому ниже вы найдете код, в котором я присоединен обработчик ItemInvoked и вызываю функцию setFocus.

 var listView = document.getElementById("basicListView");

                listView.winControl.addEventListener("iteminvoked", function (evt) {
                    if (listView.winControl.selection.count() > 0) {                        
                        msSetImmediate(setFocus);
                    }
                });

function setFocus() {
            //Set focus on input textbox;
            var input = document.querySelector("#input-box")
            input.focus();
        }

Ответ 2

На какой сборке вы работаете? пользовательский предварительный просмотр или другие предварительные просмотры dev? Я нахожусь на DP6 (доступен для партнеров MS), и работает JS стандартная работа.

В моем default.html у меня есть:

<input id="input1" type="text" value="one"/>
<input id="input2" type="text" value="two"/>
<input id="focus_btn" type="button" value="Set focus 1"/>
<input id="focus_btn2" type="button" value="Set focus 2"/>

И затем в моем default.js, в функции шаблона, загруженной приложением, я:

document.querySelector('#focus_btn').addEventListener('click', function () {
    var input1 = document.querySelector('#input1').focus();            
});

document.querySelector('#focus_btn2').addEventListener('click', function () {
    var input1 = document.querySelector('#input2').focus();            
});

Единственная причина, по которой я могу думать, что он не работает, - это доступ к элементу, прежде чем он будет готов. Это или более ранние ошибки сборки. У меня есть решение rar'd в: http://www.mediafire.com/?ghz49gtfxlgr7en, если вы хотите видеть.

Ответ 3

Попробуйте использовать обычный javascript без jquery, например

document.getElementById( 'myElementsID' ).focus()

Ответ 4

Попробуйте это, чтобы узнать, помогает ли это:

if(document.createEvent) 
{
    document.getElementById('input-box').dispatchEvent('DOMFocusIn');
} 
else 
{
    document.getElementById('input-box').fireEvent('DOMFocusIn', event);
}

Ответ 5

Хотя вопрос очень старый. Но я изо всех сил пытался найти решение для этого.

Первая вещь .focus() не возвращает никакого значения, которое только что установило фокус, и возвращается undefined.

Кроме того, когда мы фокусируем внимание на каком-то элементе, убедитесь, что элемент имеет tabindex, иначе он не будет фокусироваться (в основном, на хроме).

Можно использовать следующий запрос:

element.querySelector('#label').setAttribute('tabindex','0');
element.querySelector('#label').focus();