Question

情况：

我目前有一个搜索框，它使用了Jquery的Autocomplete插件。当用户开始输入运动队（即波士顿红袜队）的搜索框时，它将确定相关的比赛。当他们选择团队时，我希望它附加到一个列表（也许它应该附加到一个数组，因为这似乎是最常见的 - 但如果它是一个数组，我可能需要改变我当前的内容），以便他们可以有他们的运动队显示在导航栏上（我的css目前允许这样做）为了更好地了解我在这里讨论的是我的小提琴http://jsfiddle.net/saLbjdw1/1/

现有代码：

<!doctype html>
<html>
<head>
     <title>TEST</title>
     <meta charset="utf-8" />
     <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />

     <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
     <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
     <script src="http://code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
     <link rel="stylesheet" href="/resources/demos/style.css">
     <style type="text/css">

</head>

我将跳过css部分，除非请求（在JSFiddle中找到）

<body>

    <div id="container">

        <div id="topbar">

            <div class="fixedwidth">

            <p><a href="">HOME</a></p>

            <ul>
                <li id="teamBRS" class="red"><a>BOSTON RED SOX</a></li>
                <li id="teamNEP" class="blue"><a>NEW ENGLAND PATRIOTS</a></li>
                <li id="teamBC" class="green"><a>BOSTON CELTICS</a></li>
                <li id="teamBB" class="gold" style=border-right:none;><a>BOSTON BRUINS</a></li>
            </ul>

                <div class="ui-widget">
                    <input id="tags" type="text" placeholder="Search Teams">
                </div>

            </div>

        </div>

        </div>

        <script>

            $(function() {
                var availableTeams = [
                    "Boston Red Sox",
                    "New England Patriots",
                    "Boston Celtics",
                    "Boston Bruins",
                    "NEW ENGLAND REVOLUTION"
                ];
                $( "#tags" ).autocomplete({
                    source: availableTeams
                });
            });

        </script>

</body>

</html>

我确实试图将我的一些想法拼凑起来，在审查其他堆叠帖子后我可能会开始的地方，例如;使用JavaScript将用户输入（来自availableTeams []）附加到名为activeArray或list的新数组。在附加后，它将出现在#topBar ...希望

myThoughts：

    activeArray=["BOSTON RED SOX", "NEW ENGLAND PATRIOTS"];

        document.getElementById("tags").onClick=function() {

            if (document.getElementById("tags").value=="NEW ENGLAND REVOLUTION") {
                push searchedItem to activeArray
            }
            else {
                dont do anything
            }

            }

我意识到上面显示的很多东西都是垃圾，但我在一个非常基本的意义上试图概述一些粗略的想法。任何建议都会非常感激。

附加用户输入

0 个答案: