当我将行为 =“自动完成”添加到我的输入字段时,宽度会随着浏览器/屏幕调整大小而改变并且不再缩放。

有easyAutocomplete经验的人有同样的问题吗?

非常感谢你。

这段没有数据行为的代码是响应式的

  <form>
    <input class="form-control" type="text" placeholder="search">
  </form>

此带有 data-behavior="autocomplete"的代码没有响应
  <form>
    <input class="form-control" type="text" placeholder="search" data-behavior="autocomplete">
  </form>

http://easyautocomplete.com - jQuery 自动完成插件

最佳答案

您可以使用如下所示的简单自动完成功能,无需放置数据行为。
此外,您需要覆盖由 easy-autocomplete 库应用的 CSS。

var options = {
 data: ["blue", "green", "pink", "red", "yellow"]
};

$("#example").easyAutocomplete(options);
.easy-autocomplete{
  width:100% !important
}

.easy-autocomplete input{
  width: 100%;
}

.form-wrapper{
  width: 500px;
}
<link href="https://unpkg.com/[email protected]/dist/easy-autocomplete.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.easy-autocomplete.js"></script>

<form class="form-wrapper">
  <input id="example" class="form-control" type="text" placeholder="search">
</form>

关于javascript - EasyAutocomplete 和输入宽度,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47194100/

10-12 12:46