Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/382.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Twitter引导typeahead自定义按键输入功能_Javascript_Jquery_Django_Twitter Bootstrap - Fatal编程技术网

Javascript Twitter引导typeahead自定义按键输入功能

Javascript Twitter引导typeahead自定义按键输入功能,javascript,jquery,django,twitter-bootstrap,Javascript,Jquery,Django,Twitter Bootstrap,我正在制作的Django网站上使用Twitter引导。我有一个页面,用户可以在一个文本输入中输入他们的所有技术技能,该文本输入配备了引导式typeahead。我试图访问下拉菜单中当前选中的文本,这样当按下ENTER键并在下拉菜单中高亮显示某个元素时,它将获取该值并将其显示在输入文本字段下方。然后清除输入文本字段,用户可以搜索其他技能 $(document).keyup(function(event) { if (event.keyCode == 13) { if ($

我正在制作的Django网站上使用Twitter引导。我有一个页面,用户可以在一个文本输入中输入他们的所有技术技能,该文本输入配备了引导式typeahead。我试图访问下拉菜单中当前选中的文本,这样当按下ENTER键并在下拉菜单中高亮显示某个元素时,它将获取该值并将其显示在输入文本字段下方。然后清除输入文本字段,用户可以搜索其他技能

$(document).keyup(function(event) {
    if (event.keyCode == 13) {    
      if ($('.dropdown-menu').css('display') != 'none'){
        var newskill = $(".dropdown-menu > li.active").val();
        alert('Yay');
      }
      else{
        var newskill = $("#enterbox").val();
        alert('Boo');
      }      
      return false;
    }
  });
如果下拉列表可见,则enter keypress函数将获取下拉列表中当前活动的元素,并将其粘贴到文本框中(内置于引导)。没有显示警告框。你知道我怎样才能在这种情况发生之前触发我的函数吗

我们可以利用Twitter的Typeahead发出的信息,而不是听按键(如果用户用鼠标进行选择怎么办?)。即

  • typeahead:selected
    –当明确选择下拉菜单中的建议时触发
捕获所选内容 您可以使用jQuery的方法监听它,在第二个参数中,您将获得有关用户选择的信息

$('input.typeahead').on('typeahead:selected', function(event, selection) {
  alert(selection.value);
});
清除输入字段 从那里,您可以使用
选择.value
执行任何操作。唯一的“问题”是尝试使用
.val()
清除输入。由于Typeahead进行了相当多的DOM重写,因此还需要使用它们的“setQuery”方法

$('input.typeahead').typeahead('setQuery', '');

您可以在此处找到typeahead的文档

您可以在您的typeahead代码上附加侦听器,如下所示

 $('#input').typeahead({
        hint: true,
        highlight: true,
        minLength: 1
    },
    {
        name: 'some name',
        displayKey: 'value',
        source: data.ttAdapter(),

    }).on('keyup', this, function (event) {
        if (event.keyCode == 13) {
            $('#input').typeahead('close');
        }
    });

不同的是@robin.gomez这里的问题是“成功选择后我如何执行操作”,您提到的问题是“我如何让回车键选择第一个建议”。@Sinetheta:知道如何在不使用JQuery的情况下以角度捕捉此事件吗?请在这个问题上提供帮助,因为回车键选择的是突出显示的内容,这是一种非常糟糕的行为。因为回车键将随机选择当前高亮显示的项目。-->这就是我需要的
 $('#input').typeahead({
        hint: true,
        highlight: true,
        minLength: 1
    },
    {
        name: 'some name',
        displayKey: 'value',
        source: data.ttAdapter(),

    }).on('keyup', this, function (event) {
        if (event.keyCode == 13) {
            $('#input').typeahead('close');
        }
    });