jquery - 当文本输入像值时，jQuery更改选择选项

我有一个文本输入和一个select元素。
我的选择选项值都是数字，但显示的是产品名称。
当用户键入文本输入或更改文本输入时，我如何更改所选选项，但我想在select元素中选择与文本输入中的值类似的选项

// Event handler for text input
$('#txt').on('input', function() {
  // Getiing option based on input value and setting it as selected
  $('#sel option:contains(' + this.value + ')').eq(0).prop('selected', true);
});

// Event handler for select
$('#sel').change(function() {
  // Updating text input based on selected value
  $('#txt').val($('option:selected', this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="txt" />
<select id="sel">
  <option value="">Select</option>
  <option value=1>Domain Registration (.co.uk)</option>
  <option value=2>Domain Registration (.co)</option>
  <option value=3>Domain Registration (.com)</option>
  <option value=2>Domain Registration (.uk.com)</option>
</select>

最佳答案

你可以这样接近它，
HTML格式：

<input type="text" id="input">

<select id="selectId">
    <option value="1">Product 1</option>
    <option value="2">Product 2</option>
    <option value="3">Product 3</option>
</select>

查询：

$(document).ready(function(){
    $("#input").change(function(){
        var val = $("#input").val();
        $("#selectId > option").each(function() {
            if(this.text == val) {
                $("#selectId > option").removeAttr("selected");
                $(this).attr("selected","selected");
            }
        });
    });
});

请找到jsfiddle:http://jsfiddle.net/chirag1goel/Lvn9vfcx/1/
编辑：子字符串匹配。

$(document).ready(function(){
    $("#input").change(function(){
        var val = $("#input").val();
        $("#selectId > option").each(function() { //Run through the loop of each option
            if(this.text.indexOf(val)>=0) { //Find if the string present as substring
                $("#selectId > option").removeAttr("selected"); //Remove the existing selected option
                $(this).attr("selected","selected"); //Select this matching option as selected
                return false; //Return after first match is found
            }
        });
    });
});

新小提琴：http://jsfiddle.net/chirag1goel/Lvn9vfcx/2/

关于jquery - 当文本输入像值时，jQuery更改选择选项，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32615478/