多个自动完成下拉菜单不起作用

【问题标题】：multiple autocomplete dropdowns not working多个自动完成下拉菜单不起作用
【发布时间】：2012-12-06 07:42:17
【问题描述】：

当我为一个字段设置一个自动完成下拉列表时，一切正常，但是当我为更多字段添加更多下拉列表时，输入字段的值不再填充 li 的文本，该文本是从 php 文件返回的，该文件是叫

以下工作，其中 .sugnorm1 是 li 的类

var delay = (function () {
var timer = 0;
return function (callback, ms) {
    clearTimeout(timer);
    timer = setTimeout(callback, ms);
};
})();
$(document).ready(function () {
$('#quality1').bind('input propertychange', function () {
    delay(function () {
        $.post("functions/autocomplete.php", {
            quality:$(this).val(),
            questionname:"<?php echo $_SESSION['question']; ?>",
            count:1
        }, function (response) {
            $('#qualitySuggest1').hide();
            setTimeout("finishAjax('qualitySuggest1', '" + escape(response) + "')", 20);
        });
        return false;
    }, 20);
});
});

$('.sugnorm1').live("mouseover mouseout click", function(event) {
    if ( event.type == "mouseover" ) {
        $(this).addClass('sughover');
    } else if ( event.type == "click") {
        $("#quality1").val($(this).text());
        $("#qualitySuggest1").hide();
    }
    else {
        $(this).removeClass('sughover');
    }
});

$("#quality1").blur(function () {
    $("#qualitySuggest1").hide();
});


});
function finishAjax(id, response) {
$('#' + id).html(unescape(response));
$('#' + id).show();
} //finishAjax

但是，如果我添加另一个字段，则会调用质量建议 .hide()，但我无法在 event.type == click for both fields.

var delay = (function () {
var timer = 0;
return function (callback, ms) {
    clearTimeout(timer);
    timer = setTimeout(callback, ms);
};
})();
$(document).ready(function () {
$('#quality1').bind('input propertychange', function () {
    delay(function () {
        $.post("functions/autocomplete.php", {
            quality:$(this).val(),
            questionname:"<?php echo $_SESSION['question']; ?>",
            count:1
        }, function (response) {
            $('#qualitySuggest1').hide();
            setTimeout("finishAjax('qualitySuggest1', '" + escape(response) + "')", 20);
        });
        return false;
    }, 20);
});
$('#quality2').bind('input propertychange', function () {
    delay(function () {
        $.post("functions/autocomplete.php", {
            quality:$(this).val(),
            questionname:"<?php echo $_SESSION['question']; ?>",
            count:2
        }, function (response) {
            $('#qualitySuggest2').hide();
            setTimeout("finishAjax('qualitySuggest2', '" + escape(response) + "')", 20);
        });
        return false;
    }, 20);
});
});

$('.sugnorm1').live("mouseover mouseout click", function(event) {
    if ( event.type == "mouseover" ) {
        $(this).addClass('sughover');
    } else if ( event.type == "click") {
        $("#quality1").val($(this).text());
        $("#qualitySuggest1").hide();
    }
    else {
        $(this).removeClass('sughover');
    }
});

$("#quality1").blur(function () {
    $("#qualitySuggest1").hide();
});

$('.sugnorm2').live("mouseover mouseout click", function(event) {
    if ( event.type == "mouseover" ) {
        $(this).addClass('sughover');
    } else if ( event.type == "click") {
        $("#quality2").val($(this).text());
        $("#qualitySuggest2").hide();
    }
    else {
        $(this).removeClass('sughover');
    }
});
$("#quality2").blur(function () {
    $("#qualitySuggest2").hide();
});


});
function finishAjax(id, response) {
$('#' + id).html(unescape(response));
$('#' + id).show();
} //finishAjax

感谢您的帮助！

【问题讨论】：

• jsfiddle 不会受伤 ;)
• 我是 jsfiddle 的新手，我不知道它是如何工作的。我添加了代码，但无法让 jquery 成功运行。也许额外的代码会帮助 womeone 帮助我解决我的问题？ jsfiddle.net/uberbrainchild/UvfqD/3
• 点击
• 时似乎调用了我的模糊函数而不是点击函数。