首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jQuery -检索自动完成元素的值

jQuery -检索自动完成元素的值
EN

Stack Overflow用户
提问于 2018-06-06 18:41:30
回答 1查看 400关注 0票数 -1

我想检索autocomplete textbox的值。我尝试使用以下代码,但它不起作用:

代码语言:javascript
复制
$('#my_id').bind('result',function(){});

任何建议都会很有帮助。我不想使用.text(),因为它不能满足我的需求。一些类似于“result”的东西将会很棒。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-06-07 08:34:47

有两个选项。

A)使用事件处理程序select of autocomplete

代码语言:javascript
复制
$("#my_id").autocomplete({..., select: function(event, ui){...}});

B)使用事件处理程序autocompleteselect

代码语言:javascript
复制
$("#my_id").on("autocompleteselect", function(event, ui){...}});

在调试器中,您可以看到,两种情况下的事件都具有相同的autocompleteselect类型。这两种方法是等效的。如果您希望将所有相关代码放在一个块中,则可以选择A。如果您更喜欢将自动完成列表的填充与选择上的反应强烈分离,则可以选择B。

A的示例:

在输入字段中键入'a‘或'j’以查看其工作原理。

代码语言:javascript
复制
<!doctype html>
<html lang="en">

<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
    $(function() {
      var availableItems = [
        "ActionScript", "AppleScript", "Groovy", "Java", "JavaScript", "Python", "Scala"
      ];
      $("#my_items").autocomplete({
        source: availableItems,
        select: function(event, ui) {
          alert(
            "input: " + event.target.value + "\n" +
            "label: " + ui.item.label + "\n" +
            "value: " + ui.item.value);
        }
      });
    });
  </script>
</head>

<body>

  <div class="ui-widget">
    <label for="my_items">Items: </label>
    <input id="my_items">
  </div>


</body>

</html>

B:的示例

在输入字段中键入'a‘或'j’以查看其工作原理。

代码语言:javascript
复制
<!doctype html>
<html lang="en">

<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
    $(function() {
      var availableItems = [
        "ActionScript", "AppleScript", "Groovy", "Java", "JavaScript", "Python", "Scala"
      ];
      $("#my_items").autocomplete({
        source: availableItems
      });

      $("#my_items").on("autocompleteselect", function(event, ui) {
          alert(
            "input: " + event.target.value + "\n" +
            "label: " + ui.item.label + "\n" +
            "value: " + ui.item.value);
      });

    });
  </script>
</head>

<body>

  <div class="ui-widget">
    <label for="my_items">Items: </label>
    <input id="my_items">
  </div>


</body>

</html>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50718373

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档