Dropdownlist的建议与您在文本框中输入的内容相匹配

问题描述：

我有一个下拉列表，一个文本框和一个按钮。如果我在文本框中键入单词并单击按钮，则下拉列表应根据文本框中的单词选择列表项目。Dropdownlist的建议与您在文本框中输入的内容相匹配

例如：如果键入23，然后在下拉列表应该在项目开始23

你有没有试过，如果是显示一些代码 – 2012-07-19 13:21:17

欢迎来到StackOverflow！一般来说，我们希望那些在这里提出问题的人在他们的代码中遇到特定的问题 - 换句话说，您应该自己尝试一些东西，然后向我们提供有关您的代码无法正常工作的信息。有关更多解释，请阅读[FAQ]（http://stackoverflow.com/faq）。 – Blazemonger 2012-07-19 13:24:13

传说中说StackOverflow是一个地方，你只是描述你想要的和代码神奇地出现在答案部分：O – 2012-07-19 13:24:44

答

@GG。是使用jQuery UI一个更好的选择，但这里没有使用的用户界面非常简单的工作模式：http://jsfiddle.net/flackend/MA95K/2/

HTML：

<input type="text"> 
<input type="button" value="Button"> 
<select> 
    <option>20</option> 
    <option>21</option> 
    <option>22</option> 
    <option>23</option> 
</select>

的jQuery：

$('input[type="button"]').on('mousedown', function() { 

    var search_str = $('input[type="text"]').val() 

    $('option[selected="selected"]').removeAttr('selected'); 

    $('option').each(function() { 
     if($(this).text() == search_str) 
     { 
      $(this).attr('selected', 'selected'); 
      return false; 
     } 
    }); 
});

编辑

这是一个新的使用jQuery的jsfiddle UI的自动完成：http://jsfiddle.net/flackend/rPGUy/1/

编辑

$('option[selected="selected"]').removeAttr('selected');基本上是说，“发现有与值selected属性selected，如果有任何所有的选项标签，并删除该属性。 “

所以这一点，例如：

<select> 
    <option>20</option> 
    <option selected="selected">21</option> 
    <option>22</option> 
    <option>23</option> 
</select>

会变成这样：

<select> 
    <option>20</option> 
    <option>21</option> 
    <option>22</option> 
    <option>23</option> 
</select>

所以，现在当我们的jQuery选择一个新的选项标记也不会发生冲突。

感谢您的建议..我试过这一个......但它不工作... – Naveen 2012-07-19 14:32:59

它适合我，也许它没有像你期望的那样行事？我更新了我的答案，像@GG一样实现了jQuery UI。建议。 – 2012-07-19 16:38:04

能否请你解释一下代码 – Naveen 2012-07-19 17:38:25

答

jQuery UI Autocomplete似乎做的正是你所需要的，甚至更好。

Dropdownlist的建议与您在文本框中输入的内容相匹配

相关推荐