fadeIn appendTo 与 ui.item.value

Question

我正在使用 jQueryUI 的自动完成小部件从 MySQL 数据库检索主题名称。当用户从自动完成列表中选择一个主题时，我想将该主题附加到#subjects_container，并使用 fadeIn 显示它。我的问题似乎与语法有关，尽管我还没有看到我的错误。

ui.item.value 确实包含我想要附加的

检索值的函数：

function autocompletejq() {
$( "#autocomplete" ).autocomplete({
    source: "autocomplete.php",
    minLength: 1,
    delay: 0, 
    select: function(event, ui) {
        alert(ui.item.value);
        $( "<input class=\"added_chkboxes\" type=\"checkbox\" checked=\"checked\" />" + ui.item.value + "").appendTo( "#subjects_container" );
    }
});

}

令我沮丧的是，只附加了复选框！也许我的串联是错误的。

注意：此处未显示 hide() 和 fadeIn()。

最终解决方案

将 ui.item.value 包裹在 html 标签中，这里 标签：

function autocompletejq() {
$( "#autocomplete" ).autocomplete({
    source: "autocomplete.php",
    minLength: 1,
    delay: 0, 
    select: function(event, ui) {
        alert(ui.item.value);
        $( "<input class=\"added_chkboxes\" type=\"checkbox\" checked=\"checked\" /><span>" + ui.item.value + "</span>" ).appendTo( "#subjects_container" ).hide().fadeIn();
    }
});

}

Answer 1

关于效果部分：

$("<p>My new Content</p>").appendTo("#myWrapper").hide().fadeIn();

关于对象创建：
我认为你需要将你的“ui.item.value”包装在一个html标签中，例如一个span。

总而言之，我会尝试某事。像这样：

var newHTML = '<input class="added_chkboxes" type="checkbox" checked="checked" />' +      
    '<span>ui.item.value</span>';
$(newHTML).appendTo("#subjects_containe").hide().fadeIn();

这是一个虚拟示例： http://jsfiddle.net/SunnyRed/dB2uT/

希望这有帮助。