0

我有一个选择下拉菜单，如果用户单击该选择下拉菜单的“外部”，我希望它消失。这是我目前拥有的：

$(this).html($("<select/>", {
  id: 'sel',
  change: function() {
    selectdone(this, title_id, status_type);
  },
  blur: function() {
    selectdone(this, title_id, status_type);
  },

在上面，如果我在下拉列表之外单击，则不会发生任何事情。函数触发的唯一时间是我更改了选择下拉列表的值。

我将如何完成上述操作，以便当用户单击选择下拉列表之外的文档上的任何位置时，它会触发此功能？

4

1 回答 1

2

我不认为这是可能的。正如在另一个答案中指出的那样，活动似乎<select>正在禁止接受其他输入。

请参阅我更新的小提琴。请注意，当您单击背景时，您会test在选择未展开时收到警报。当它展开并单击关闭时，警报不会触发。这似乎是浏览器的默认行为。在激活选择时，它似乎忽略了所有其他输入（包括鼠标移动）。

selectedIndex但是，我可以通过将-1设置为任何选定元素来触发您的事件。这样，任何有效的选项都会导致更改。

例子

$(function(){    
    var title_id = '', status_type = ''; 
    $('body').html(
        $("<select/>", {
            id: 'sel',
            change: function() {
                selectdone(this, title_id, status_type);
            },
            blur: function() {
                selectdone(this, title_id, status_type);
            }
        })
        .append($('<option />', { 'text':'one'}))
        .append($('<option />', { 'text':'two'}))
    );

    $('#sel').prop('selectedIndex', -1); 
});

function selectdone(element, titleid, statustype){
    $(element).hide().prop('selectedIndex', -1); 
}
于 2012-07-10T01:12:51.480 回答