javascript - 搜索建议点击内容转到 codeigniter 中的文本区域

Question

当我在input中输入某个关键字时，会出现搜索选项，但是当我单击建议的关键字时，它不会转到该搜索结果的地址。如何使搜索结果包含结果链接？ 工作示例位于 http://max2colors.com/网站上的搜索选项。

<script type="text/javascript">

function ajaxSearch()
{   
    var input_data = $('#query').val();

    if (input_data.length === 0)
    {
        $('#suggestions').hide();
    }
    else
    {

        var post_data = {
            'query': input_data,
            '<?php echo $this->security->get_csrf_token_name(); ?>': '<?php echo $this->security->get_csrf_hash(); ?>'
            };

        $.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>user/autocomplete",
            data: post_data,
            success: function (data) {
                // return success
                if (data.length > 0) {
                    $('#suggestions').show();
                    $('#autoSuggestionsList').addClass('auto_list');
                    $('#autoSuggestionsList').html(data);
                }
            }
         });

     }
 }
</script>

Answer 1

如果您想根据单击的建议项设置输入值，请尝试使用如下 jquery 代码:

<script type="text/javascript">

$('#autoSuggestionsList li').click(function (e) { // suggestion item click event
    $('#query').val($(this).text()).focus(); // get the suggestion value & apply the value to the input
    $('#suggestions').hide(); // close the suggestion list
});

function ajaxSearch()
{   
    var input_data = $('#query').val();

    if (input_data.length === 0)
    {
        $('#suggestions').hide();
    }
    else
    {

        var post_data = {
            'query': input_data,
            '<?php echo $this->security->get_csrf_token_name(); ?>': '<?php echo $this->security->get_csrf_hash(); ?>'
            };

        $.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>user/autocomplete",
            data: post_data,
            success: function (data) {
                // return success
                if (data.length > 0) {
                    $('#suggestions').show();
                    $('#autoSuggestionsList').addClass('auto_list');
                    $('#autoSuggestionsList').html(data);
                }
            }
        });

    }
}
</script>