个人中心
gpt4 book ai didi

jquery-ui - JQuery UI Autocomplete focus()在Internet Explorer中意外调用

转载 作者：行者123 更新时间：2023-12-04 18:12:56 25 4
gpt4 key购买 nike

我使用JQuery UI创建了一个简单的自动完成控件。输入字段的默认值为“输入您的关键字...”。我设置了一个focus()事件，当用户将焦点设置为输入字段时，该事件将清除输入。

在IE中，当您键入内容并且菜单显示项目列表时，从菜单中选择项目时，将再次调用focus()。对focus()的此额外调用仅在IE中发生。副作用是从文本字段中清除了选定的菜单项。

通过使用autocomplete.focus()事件，我对此有一个非常原始的解决方案。当用户将鼠标悬停在所选菜单项上时，将触发此事件。在这里，我可以设置一个全局 bool 变量，该变量可用于告诉输入字段上的focus()事件菜单项处于事件/可见状态，因此不清除输入值。当然，这是骇客!

是否有其他解决方案(少了hacky!)来解决此问题？

这是代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Autocomplete demo</title>
    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>
</head>
<body>
<script>
    $(function () {
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $("#tags").autocomplete({
            source: availableTags,
            focus: function (event, ui) {
               // This event fires when an item from the menu is selected (in focus)
               // set some variable here to tell the focus() call to the text field not to clear the value from the input field
            },
        });

        $("#tags").focus(function () {
            // clear the input value
            $("#tags").val("");
        });
    });
</script>

<div class="demo">

    <div class="ui-widget">
        <label for="tags">Tags: </label>
        <input id="tags" value="Enter your keywords..." />
    </div>

</div>
</body>
</html>

更新

通过对该解决方案稍加调整，并在提供的答案的帮助下，此方法现在可以在IE 8和9中使用。 
$(document).ready(function () {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];
    $("#tags").autocomplete({
        source: availableTags
    });

    $("#tags").focus(function () {
        // clear the input value
        $("#tags").val("");

      return false;
    });
})

最佳答案

我们有一个类似的问题，我相信我们通过在return false;方法中添加focus来解决此问题:

$("#tags").focus(function () {
        // clear the input value
        $("#tags").val("");

      return false;
    });

另外，在 focus声明之后，您似乎还有一个额外的(尾随)逗号。可能要清理。

更新

在jsbin.com中玩弄了一些代码之后，我想我找到了解决您的IE特定问题的解决方案，但是对于它为什么仅在IE中消失，我不是100％的。

示例: http://jsbin.com/aqituk/2/edit#javascript,html

区别在于将 $(function() { ...更改为完整的文档就绪功能 $(document).ready(function() {...
希望这可以帮助!

关于jquery-ui - JQuery UI Autocomplete focus()在Internet Explorer中意外调用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9568145/

25 4 0
文章推荐： asp.net-mvc - 使用 MVC 绑定(bind)具有数组的 QueryString
文章推荐： r - 爆炸日期范围为 R
文章推荐： php - cookies 的解剖
文章推荐： scala-将自类型注释类传递给子对象
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com