Question

我在类别中使用jquery自动填充功能，并且我希望将类别作为项目进行点击。

$(function() {
$("#js_autocomplete_ville").autocomplete({
    source: "ajax_villes.php",
    delay: 100,
    minLength: 1, 
    select: function(event, ui) {
        $('#js_searchform').prepend('<input type="hidden" name="villeid" value="' + ui.item.label + '">');
    },
    create: function() {
        $('.ui-autocomplete').addClass('ui-front');
        var currentDepartement = "";
        var currentVilleDepartement = "";
        $(this).data('ui-autocomplete')._renderItem = function(ul, item) {
            if (item.dep_nom != currentDepartement) {
                ul.append("<li class='js_level1 ui-autocomplete-category' id='li_" + item.num_departement + "'>" + item.dep_nom + " (" + item.num_departement + ")</li>");
                currentDepartement = item.dep_nom;
            }
            var itemVilleDepartement = item.dep_nom + item.v_nom;
            if (itemVilleDepartement != currentVilleDepartement) {
                currentVilleDepartement = itemVilleDepartement;
                return $("<li class='js_level2' id='" + item.label + "'>")
                        .append('<a>' + item.value + '</a>')
                        .appendTo(ul);

            } else {
                return $("")
                        .append('')
                        .appendTo(ul);
            }
        };
    },
    focus: function(event, ui) {
        $("#js_autocomplete_ville").val(ui.item.value);
        return false;
    },
    // optional
    open: function(event, ui) {
        $(".ui-autocomplete").css("z-index", 1000);
    }
});});

我尝试在＆＃39;选择＆＃39;事件但没有结果！可能吗？有任何想法吗？谢谢你的帮助，威利

Answer 1

是的，但由于添加的项是动态的，您需要使用附加到不变的祖先元素的委托事件处理程序：

e.g。类似的东西：

$(document).on('click', '.js_level1', function(){
   alert(".js_level1 clicked!");
});

它的工作原理是监听冒泡事件，然后在事件时应用jQuery选择器，而不是事件注册时间。这意味着单击时只需要存在元素。

如果您没有可以选择的更接近的元素，则

document是默认值。永远不要将'body'用于委派活动，因为样式可以阻止body响应冒泡的点击事件。

注意： 如果代码没有运行（例如在JSFiddle中），我就不能更具体了

Answer 2

这是我的解决方案，感谢TrueBlueAussie

$(document).on('click', '#ui-id-1 .js_level1', function() {
var inputValue = $(this).attr('id');
var inputLabel = $(this).text();
$("input[name='ville_id_moteur']").val(inputValue);
$("input[name='ville']").val(inputLabel);
$("#js_autocomplete_ville").autocomplete("close");

}）;

再见威廉

Jquery自动完成，使类别可单击

2 个答案: