0

在挣扎了很多天并搜索了各种论坛之后,我会在这里尝试一下。

我无法让 jQuery UI 自动完成小部件与 Mottie 虚拟键盘 ( https://github.com/Mottie/Keyboard ) 一起使用。只要您使用物理键盘,带有 ajax 加载值的 jQuery Autocomplete 就可以正常工作。如果我通过虚拟键盘输入 2 个字符,我会看到这些字符但没有自动完成列表。如果我在物理键盘上输入第三个字符,它会显示第一个列表。因此,物理输入的数据正确地附加到虚拟输入的数据上。试图省略 Ajax 部分并使用一些简单的单词作为测试,相同的行为。检查过 IE、Firefox、Chrome:都一样。通过鼠标从自动完成列表中选择一个值也不起作用。

有人解决了这个问题并创建了一个工作示例吗?

这是我的测试代码:

<... load jQuery, virtual keyboard, CSS etc...>
<script>
    $(document).ready(function() {
        $(function() {
            function log(message) {
                $("<div>").text(message).prependTo("#log");
                $("#log").scrollTop(0);
            }
            $('#sometext').keyboard({
                usePreview: false,
                position: {at: 'right bottom', of: '#log'}
            }).autocomplete({
                source: ['One', 'Two', 'Three', 'Musketiers'],
                minLength: 1,
                select: function(event, ui) {
                    if (ui.item) {
                        log("Selected: " + ui.item.label);
                    }
                }
            }).addAutocomplete();
        });
    });
</script>

<div class="ui-widget">
    <label for="sometext">Some label: </label>
    <input id="sometext" />
</div>
<div class="ui-widget" style="margin-top: 2em; font-family: Arial;">
    <div id="log" style="height: 50px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>

更新:看起来 Mottie 虚拟键盘找不到 jQuery 自动完成功能。在源代码(从第 88 行开始)中它说:

// set up after keyboard is visible
base.autocomplete_setup = function() {
    // look for autocomplete
    base.$autocomplete = base.$el.data('autocomplete');
    base.hasAutocomplete = (typeof(base.$autocomplete) === 'undefined') ? false : (base.$autocomplete.options.disabled) ? false : true;

'base.hasAutocomplete' 结果是假的

4

1 回答 1

3

这个问题在较新版本的 jquery.keyboard.extension-autocomplete.js 中解决了。

据此,用于检查 JQuery-UI 版本 自动完成代码与 JQuery-UI 版本 1.10 存在问题,并且在 jquery.keyboard.extension-autocomplete.js 中进行了以下更改:

base.$autocomplete = base.$el.data('autocomplete'); //removed
base.$autocomplete = base.$el.data('autocomplete') || base.$el.data('uiAutocomplete'); //added
于 2014-01-12T09:39:38.340 回答