blocks|key|1591410|text|看一看http://docs.jquery.com/Plugins/Autocomplete|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1591411|这里还有一个与ASP.Net一起使用的tutorial|1591412|entityMap|0|LINK|mutability|MUTABLE|url|http://docs.jquery.com/Plugins/Autocomplete|1|http://www.eggheadcafe.com/tutorials/aspnet/18b6a1fa-a7cf-4507-84f2-15056fe65bb7/autocompletion-with-jque.aspx^0|3|17|0|0|J|8|1|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|F|3|-4|5|6|7|X|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]|N|$5|I|J|K|C|$L|O]]]]

<p>Take a look at <a href="http://docs.jquery.com/Plugins/Autocomplete" rel="noreferrer">http://docs.jquery.com/Plugins/Autocomplete</a></p>

<p>Also here is a <a href="http://www.eggheadcafe.com/tutorials/aspnet/18b6a1fa-a7cf-4507-84f2-15056fe65bb7/autocompletion-with-jque.aspx" rel="noreferrer">tutorial</a> for use with ASP.Net</p>


blocks|key|1660079|text|如果这些是已知字段，则可以在OnUpdate事件上使用JQuery：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1660080|1660081|如果列表很长，向您的all服务器发出Ajax请求，检索最佳选项|ordered-list-item|1660082|如果列表很短，您可以将所有选项加载到页面，并在不发出服务器请求的情况下提供可选文本。|1660083|1660084|查看JQuery库，了解如何显示建议的实现。|1660085|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|N|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|O|8|@]|9|@]|A|$]]|$1|F|3|G|5|E|7|P|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|L|$]]

<p>If these are known enrties, you can use JQuery, and on the OnUpdate event:</p>

<ol>
<li>if it's a long list, make Ajax Request to your webserver, retrieve the best option</li>
<li>if it's a short list, you can load all the options to the page, and offer the optional texts without making a server request.</li>
</ol>

<p>Checkout the JQuery library for implementations on how to display the suggestion.</p>


blocks|key|1591466|text|作为ASP.NET的AJAX控件工具包的过去，有一个AutoComplete扩展器，你可以为客户端缓存，延迟间隔设置很多不同的选项。只需将其指向web服务或页面方法，然后就可以了。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1591467|entityMap|0|LINK|mutability|MUTABLE|url|http://www.asp.net/AJAX/AjaxControlToolkit/Samples/AutoComplete/AutoComplete.aspx^0|Q|C|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

<p>There's an <a href="http://www.asp.net/AJAX/AjaxControlToolkit/Samples/AutoComplete/AutoComplete.aspx" rel="nofollow noreferrer">AutoComplete</a> extender as past of the AJAX Control Toolkit for ASP.NET. There are plenty of different options that you can set for client caching, delay interval. Just point it at a web service or page method and away you go.</p>


blocks|key|1591488|text|也检查complete.ly|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1591489|http://complete-ly.appspot.com/|offset|length|1591490|它没有依赖关系，权重也很小。|1591491|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|V|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@$D|Q|E|R|1|S]]|A|$]]|$1|F|3|G|5|6|7|T|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|U|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|C]]]]

<p>check complete.ly too </p>

<p><a href="http://complete-ly.appspot.com/" rel="nofollow">http://complete-ly.appspot.com/</a></p>

<p>it has no dependencies and weights very little.</p>


blocks|key|1591503|text|TextBoxValueToDropDownList|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1591504|++++function+AddNames(text)+{

++++++++if+(document.myForm.insertText.value+==+"")+{
++++++++++++document.getElementById("insertText").style.border+=+"1px+solid+red";
++++++++++++return+false;
++++++++}
++++++++else+{
++++++++++++var+option+=+document.createElement("OPTION");
++++++++++++option.text+=+text.value;
++++++++++++option.value+=+text.value;
++++++++++++document.getElementById("dropDownList").options.add(option);
++++++++++++document.myForm.insertText.value+=+"";
++++++++++++document.getElementById("insertText").style.border+=+"1px+solid+green";
++++++++}
++++}




++++<form+name="myForm">
++++++++<table>
++++++++++++<tr>
++++++++++++++++<td>
++++++++++++++++++++<input+type="text"+name="insertText"+id="insertText"+/></td>
++++++++++++++++<td></td>
++++++++++++++++<td>
++++++++++++++++++++<select+name="dropDown"+id="dropDownList">
++++++++++++++++++++</select>
++++++++++++++++</td>
++++++++++++</tr>
++++++++++++<tr>
++++++++++++++++<td>
++++++++++++++++++++<input+type="button"+value="Insert"+id="button"+onclick="AddNames(insertText);"+/></td>
++++++++++++</tr>
++++++++</table>
++++</form>|code-block|syntax|javascript|1591505|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>TextBoxValueToDropDownList
    </p>

<pre><code>    function AddNames(text) {

        if (document.myForm.insertText.value == "") {
            document.getElementById("insertText").style.border = "1px solid red";
            return false;
        }
        else {
            var option = document.createElement("OPTION");
            option.text = text.value;
            option.value = text.value;
            document.getElementById("dropDownList").options.add(option);
            document.myForm.insertText.value = "";
            document.getElementById("insertText").style.border = "1px solid green";
        }
    }




    &lt;form name="myForm"&gt;
        &lt;table&gt;
            &lt;tr&gt;
                &lt;td&gt;
                    &lt;input type="text" name="insertText" id="insertText" /&gt;&lt;/td&gt;
                &lt;td&gt;&lt;/td&gt;
                &lt;td&gt;
                    &lt;select name="dropDown" id="dropDownList"&gt;
                    &lt;/select&gt;
                &lt;/td&gt;
            &lt;/tr&gt;
            &lt;tr&gt;
                &lt;td&gt;
                    &lt;input type="button" value="Insert" id="button" onclick="AddNames(insertText);" /&gt;&lt;/td&gt;
            &lt;/tr&gt;
        &lt;/table&gt;
    &lt;/form&gt;
</code></pre>


blocks|key|358836|text|使用HTML5+(当然是针对小型数据集)的一种方法是datalist|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|358837|<input+list="users"+name="users">
++<datalist+id="users">
++++<option+value="Alice">
++++<option+value="Bob">
++++<option+value="Chuck">
++++<option+value="Chris">
++++<option+value="Duke">
++++<option+value="Emily">
++</datalist>|code-block|syntax|javascript|358838|对于较大的数据集，AJAX是一种更好的方法。|358839|entityMap^0|Q|8|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|S|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

<p>One way to do this using HTML5 (for small datasets of course) is <code>datalist</code>:</p>

<pre><code>&lt;input list="users" name="users"&gt;
  &lt;datalist id="users"&gt;
    &lt;option value="Alice"&gt;
    &lt;option value="Bob"&gt;
    &lt;option value="Chuck"&gt;
    &lt;option value="Chris"&gt;
    &lt;option value="Duke"&gt;
    &lt;option value="Emily"&gt;
  &lt;/datalist&gt;
</code></pre>

<p>For larger datasets AJAX is a better way to go.</p>


<p>I currently have a databound dropdown list on my ASP.Net C# 2.0 website that has around 400 items in it. I want to replace it with something similar like the textbox in google search where you enter letter and only the entries starting with those letters pop up</p>

<p>what is a good way of implementing it? Are there controls that already exists that anybody can suggest?</p>


Text box with drop down suggestions

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我目前在我的ASP.Net C# 2.0网站上有一个数据绑定下拉列表，其中包含大约400个项目。我想用类似于谷歌搜索中的文本框来代替它，在文本框中输入字母，只有以这些字母开头的条目才会弹出什么是实现它的好方法？是否有任何人都可以建议的已经存在的控制措施？

问包含下拉建议的文本框
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问包含下拉建议的文本框EN