小白求助， JQuery 的 autocomplete 问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 1308 天前的主题，其中的信息可能已经有所发展或是发生改变。

想实现的功能：根据 select 的值，另一个 input 提供相应的 availableTags 来提示输入。比如 select 选择北京，那 input 就提供北京相关的 availableTags

没接触过前端，目前探索到这里，应付下作业：

使用 Jquery 的 autocomplete 。点击按钮，想实现 availableTags2 里的提示，但是没反应（是不是生成 html 的时候 id 就固定了？）。

请问该如何修改？


<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI 自动完成（ Autocomplete ） - 默认功能</title>
  <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
  <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
  <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="jqueryui/style.css">
  <script>
  $(function() {
    var availableTags1 = ["ActionScript","AppleScript","Asp"];
	var availableTags2 = ["Basic","Basketball", "Banana" ];
    $( "#availableTags1" ).autocomplete({
      source: availableTags1
    });
    $( "#availableTags2" ).autocomplete({
      source: availableTags2
    });
  });
  </script>
</head>
<body>
 
 <input id="availableTags1"><button type="button" onclick="myFunction0()"> 使用 tags2 </button> 
<script>
function myFunction0()
{
    document.getElementById("availableTags1").id= "availableTags2"
};
</script>
 
 
</body>
</html>

第 1 条附言 · 2021-05-13 17:25:20 +08:00

给张图片可能会清晰点。https://imgtu.com/i/gD9nmQ

[url=https://imgtu.com/i/gD9nmQ][img]https://z3.ax1x.com/2021/05/13/gD9nmQ.png[/img][/url]

第 2 条附言 · 2021-05-13 19:18:14 +08:00

解决了换成了 datalist

7 条回复 • 2021-05-14 11:45:33 +08:00