javascript - 自动完成搜索有效,但未被选中

标签 javascript jquery

输入文本框是通过 jquery 动态创建的。自动完成效果很好。但是当我选择一个项目时,它的值没有正确呈现,我可以知道我在这里遗漏了什么吗?

查询

$(function() {
  var projects =  [
    {
        "label": "ajax",
        "value": "1003",
        "desc": "foriegn"
    },
    {
        "label": "jquery",
        "value": "1000",
        "desc": "dd"
    },


    {
        "label": "wordpress theme",
        "value": "1000",
        "desc": "h"
    },
    {
        "label": "xml",
        "value": "1000",
        "desc": "j"
    } ]; 

$("#addButton");
var counter = 13;

$("#addButton").click(function() {
    var newTextBoxDiv = $(document.createElement('div'))
            .attr("id", 'TextBoxDiv' + counter);

    var roleInput = $('<input/>', {
        type: 'text',
        placeholder: 'Role',
        name: 'Role' + counter,
        id: 'project-description' + counter
    });

    var searchInput = $('<input/>', {
        type: 'text',
        placeholder: 'search',
        name: 'search' + counter,
        id: 'project' + counter
    });

    var hidd = $('<input/>', {
        type: 'hidden',
        name: 'searchhid' + counter,
        id: 'project-id' + counter
    });


    newTextBoxDiv.append(roleInput).append(searchInput).append(hidd);
    newTextBoxDiv.appendTo("#TextBoxesGroup");
    $("#project" + counter).autocomplete({
        minLength: 0,
        source: projects,
        focus: function(event, ui) {
            $("#project" + counter).val(ui.item.label);
            return false;
        },
        select: function(event, ui) {
            $("#project" + counter).val(ui.item.label);
            $("#project-id" + counter).val(ui.item.value);
            $("#project-description" + counter).val(ui.item.value);
            $("#project-icon" + counter).attr("src", "images/" + ui.item.icon);
            return false;
        }
    })


    counter++;
});





});

` html在下面

<div id="project-label"></div>

<input id="project" />
<input type="hidden" id="project-id" />

<input type="text" disabled="disabled" id="project-description"></p>


 <div id='TextBoxesGroup'>
 <div id="TextBoxDiv1" class="form-inline control-group">

 </div>
</div>
 <input type='button' value='Add' id='addButton' />

请告诉我这段代码中缺少什么。

最佳答案

我认为这是一个 JavaScript 错误。自动完成中的 select 事件查找 $("#project-icon"+ counter),但我没有看到该元素在任何地方呈现。此外,当尝试设置该元素的 src 属性时,您引用了 ui.item.icon,但您的值数组不包含该属性。

关于javascript - 自动完成搜索有效,但未被选中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19981900/

相关文章:

JavaScript - 在 Javascript 中获取 DOM 元素中包含的文本?

javascript - 图形图像大小受到干扰,可能是受 Canvas 影响

javascript - 模拟 jquery 选择器并返回一个 html 元素

jquery - 如何使 jQuery 数据表分页忽略隐藏行?

javascript - YouTube 视频的播放/暂停按钮

javascript - TypeError : userData. 即使 userData 是一个数组, map 也不是一个函数

javascript - 在 Angular JS 中单击按钮时将 View 从一个页面切换到另一页面

javascript - 从变量值获取对

javascript - 根据订购的产品创建提交表单(将表格包装到表单中并再次将其显示为表格)

javascript - Bootstrap select picker 根据key自动排序