Question

我有一个自动完成下拉列表，当用户开始在文本框中输入时出现（我使用jquery mobile但我不认为这对我的问题非常重要）。我希望能够在用户点击页面上的任何位置时隐藏整个下拉列表。但是，当用户实际点击下拉列表时，我不想隐藏下拉列表。

我是否有办法捕捉点击事件以了解点击的内容？

这是我的模糊功能：

//hide autocomplete when dropdown is not clicked
$("#search-div input").blur(function () {
    $("#autocomplete-list").hide();
});

我在考虑以某种方式在我的模糊函数中添加if语句。这是我的伪代码：

if( dropdown clicked)
{
    run code to take text from dropdown and place in textbox
}
else
{
    hide dropdown
}

在我的模糊功能中，是否可以知道我的下拉列表是否被点击或者是否点击了其他内容？当我调试我的javascript时，我只看到与文本框相关的事件做模糊（）

修改

这是我用来处理点击下拉列表时的功能：

$( document).on( "click", "#autocomplete-list li", function() {
    var selectedItem = event.target.innerHTML;
    $(this).parent().parent().find('input').val(selectedItem);
    $('#autocomplete-list').hide();
    runSearchQuery();
});

Answer 1

您可以收听任何点击，而不仅仅是模糊，然后检查点击的元素是什么。 e.currentTarget为您提供点击的内容。

var clickHandler = function(e) {
  if ($(e.currentTarget).hasClass('dropdown')) {
    // do nothing
  } else {

    // Make sure you unregister your event every
    // time the dropdown is hidden.
    $(window).off('click', clickHandler);
    // hide
  }
}

// When the dropdown comes down, register an event on the whole page.
$(window).on('click', clickHandler);

如何检查是否在jquery中使用.blur（）单击了某个特定项目

1 个答案: