javascript - 将选择的(单击的)选项传递到输入框

Question

我有一堆输入建议，但我无法使它们可点击。

<div class="search_native">
    <input type="text" name="native_input" id="native"/>
    <div id='output'></div>
</div>

$(document).ready(function() { 
    $("input").keyup(function(){
        $array = ['usa','france','germany','italy','poland'];
        $input_val = $("input[name='native_input']").val();
        $('#output').text('')
        r = new RegExp($input_val)
        for (i = 0; i < $array.length; i++) {
            if ($array[i].match(r)) {
                $('#output').append('<p class="match">' + $array[i] + '</p>')
            }
        }
    });

    $('.match').click(function(e) {
        alert('df');
    });
});

我尝试检查单击匹配是否有效，但无效。 alert() 不会弹出。为什么？还有一个问题;如果我需要将单击的选项中的值放入输入框中，我可以为其制作类似的东西(当已单击时)吗？

$value = $(this).val();
$('#native').val() = $value;

Answer 1

当您的 $('.match') 选择器运行时，没有匹配的元素，因为页面加载后就会发生这种情况。

您可以委托(delegate)给父级或文档，因为这将在事件冒泡后捕获事件:

$(document).on('click', '.match', function(){
    alert('df');
    $value = $(this).text();
    $('#native').val($value);
});

.val() 语法需要新值作为参数。