1

JQM 1.3.2 / ASP.NET MVC 4

选择一个值时，焦点未正确设置到输入字段，我错过了什么？

周围的典型 jqm-shadow 没有从选择中删除，输入获得阴影效果，但光标没有设置到输入字段中。

JavaScript：

$('#IndexScanPage').on('change', '#locationCode', function (e) {
    $('#locationCode').blur();
    $('#_inputEAN').focus();
});

部分html代码：

<div id="IndexScanPage">
    <select name="locationCode" id="locationCode" data-native-menu="false" data-icon="home">
        <option value='' data-placeholder="true">Lagerauswahl</option>
        @{
            foreach ( var location in Model.Locations)
            {
                <option value='@location.LocationCode'>@location.LocationDescription</option> 
            }
        }
    </select>

    <div class="ui-grid-solo">
        <div class="ui-block-a">
            <input id="_inputEAN" name="barcode" data-clear-btn="true" autocomplete="off" autofocus required />
            <div class="spacer"></div>
            <input type="submit" name="submitButton" id="submitButton" value="Weiter" data-role="button" data-iconpos="right" data-icon="search" />
        </div>
    </div>
</div>

编辑：

从@Omar 扩展小提琴：http: //jsfiddle.net/tronc/qMjy9/1/

单击额外按钮正确聚焦输入，为什么脚本代码不起作用？

4

1 回答 1

2

使用 selectmenudata-native-menu="false"将其转换为弹出窗口并隐藏本机选择菜单。

当您选择一个选项时，它会经历几个阶段。

  • 弹出窗口已关闭/隐藏
  • 原生选择菜单已更新
  • jQM 虚拟选择菜单文本已更新
  • jQM 虚拟选择菜单获得焦点

因此，您需要等到上述所有步骤都完成。

$("#IndexScanPage").on('change', '#locationCode', function (e) {
  setTimeout(function () {
    $('#_inputEAN').focus();
  }, 50); // minimum value - tested on Chrome
});

演示

于 2013-10-18T14:55:50.063 回答