Фокус внутри выбора с помощью JavaScript? - PullRequest
Новая
       3

Фокус внутри выбора с помощью JavaScript?

2 голосов
/ 21 марта 2012

Следующий код отлично работает в большинстве браузеров, но не работает в Internet Explorer CE Mobil, и я не могу понять, почему. 

function autofocus() {
    var el = document.getElementById("autofocus");
    if (el === null) {
        return;
    } else if (el.tagName.toUpperCase() == "SELECT") {
        if (el.selectedIndex == -1) {
            el.options[0].selected = true;

        }
    }
    el.focus();
}

$(window).ready(function () {
    autofocus();  
});​

Он отлично работает во всех обычных браузерах, которые я пробовал, но в Internet Explorer Mobile кажется, что он сосредоточен на самом списке выбора, что означает, что невозможно перемещаться по различным параметрам, не нажимая один из них. Может быть, если я выберу один из вариантов вместо этого? См. http://jsfiddle.net/mhenrixon/sbwCv/19/ для примера того, что не работает.

РЕДАКТИРОВАТЬ: Это не имеет никакого отношения к selectedIndex как таковой, так как большую часть времени будет selectedIndex, как 15, 5, 27 или что-то еще. Только не -1. ​​

Ответы [ 2 ]

1 голос
/ 30 марта 2012

На моем Samsung Saga у меня работает:

Mozilla / 4.0 (совместимо; MSIE 6.0; Windows CE; IEMobile 7.11) VZW: SCH-i770 PPC 320x320

и проблема в этом браузере - функция jQuery ready.

Если вместо этого вы используете <body onload="autofocus()">, для <select> будет выбран первый параметр. И этот вариант действительно сфокусирован; если я использую оптическую мышь, я могу стрелку вправо на другой параметр и пробел, чтобы выбрать его.

Итак, вот контрольный пример, с которым я закончил: 

<html>
<head>
<title>Test</title>
<!-- script type="text/javascript" src="jquery-1.4.2.js" -->
<script type="text/javascript">
function autofocus() {
    var el = document.getElementById("autofocus");
    if (el === null) {
        return;
    } else if (el.tagName.toUpperCase() == "SELECT") {
        if (el.selectedIndex == -1) {
            el.options[0].selected = true;
        }
    }
    el.focus();
}

/*
$(window).ready(function () {
    autofocus();  
});
*/
</script>
</head>
<body onload="autofocus()">
<select autofocus="autofocus" id="autofocus" multiple="multiple">
    <option value="0">0:17,00st</option>
    <option value="P11">P11:1918,00st</option>
    <option value="P12">P12:100,00st</option>
</select>
</body>
</html>

И, конечно, он работает и в настольных браузерах.

0 голосов
/ 26 марта 2012

вы можете попробовать, если el.selectedIndex = 2; работает или нет, я не могу воспроизвести эту проблему в IE8, поэтому может быть проблема просто связана с IE CE Mobile 

function autofocus() {
    var el = document.getElementById("autofocus");
    if (el === null) {
        return;
    } else if (el.tagName.toUpperCase() == "SELECT") {
        if (el.selectedIndex == -1) {
            el.selectedIndex = 0;
            el.options[0].selected = true;
        }
    }
    el.focus();
}

$(window).ready(function () {
    autofocus();  
});
...