Javascript 谷歌放置自动完成-点击链接使函数运行

我有一个使用google places autocomplete的输入字段。在用户键入位置时出现的下拉菜单顶部，我添加了一个链接，上面写着“找不到地址？”

我想要实现的目标：

当用户单击“找不到地址？”时，我希望显示一些输入字段，就像这样

（我从eventbrite那里得到了这个图像和想法）

我希望这些字段显示在事件位置输入字段的正下方

我的想法是，我只需在这些输入字段中添加一个隐藏类（display:none），当用户单击“找不到地址”时，我会删除该类。理论上，这应该是可行的

然而，我似乎不知道如何识别用户点击了链接。我试图通过在用户单击“找不到地址”时简单地输出“Clicked！”来简化问题。但即使这样也不行。有什么想法吗

这是我的密码：

<div class="form-group">
    <label for="location">Event Location</label>
    <input name="location" type="text" class="form-control" id="location" placeholder="Hogwarts School, 127 Long Island">
</div>
<script>
          var ac = new google.maps.places.Autocomplete(document.getElementById('location'));
          ac.addListener('place_changed', function() {
              var place = ac.getPlace();                 
          });
          $('#location').on('click', function() {
                var picklist = $('.pac-container');
                var link = picklist.find('a');
                if(link.length === 0) {
                    picklist.append("<div class='pac-item'><a class='toggle'><div class='pac-icon'></div> Can't find address?</a></div>");
                    $('.toggle').on('click',  function() {
                          console.log("clicked!");

                    });
                }
          });

</script>

活动地点
var ac=new google.maps.places.Autocomplete（document.getElementById（'location'）；
ac.addListener（'place_changed'，function（）{
var place=ac.getPlace（）；
});
$（'#位置'）。在（'单击'，函数（）上）{
var picklist=$（'.pac container'）；
var link=picklist.find（'a'）；
如果（link.length==0）{
附加（“找不到地址？”）；
$（'.toggle'）。打开（'click'，function（）{
log（“单击！”）；
});
}
});

我猜autocomplete会在内部克隆您传入的任何html，以便删除事件处理程序，但您可以使用冒泡来委托单击

”。在某些根节点上切换“

”，如

解决了这个问题！非常感谢你的帮助

所以基本上，当我在电话上试着用anonymous'fiddle时，它起了作用。换句话说，“点击触摸启动”被识别。在我的笔记本电脑上，我将“点击触控启动”改为“鼠标悬停”，然后将鼠标悬停在“找不到地址”上。它起作用了——检测到了悬停。这意味着事件“单击”未注册

因此，我查看了mdn事件引用

单击：已在图元上按下并释放定点设备按钮（任意按钮）

问题是，只要按下鼠标，pac容器就会被移除。换句话说，你不会得到点击和释放

因此，我没有使用“click”，而是使用了“mousedown”事件，它只需要一个mousepress。它成功了

$(document).on('mousedown', '.toggle',function() {
      console.log("clicked!"); 
      alert("HI");
      $('.pac-container').remove();
});

你是在电话里试这个吗？如果是这样的话，那么你也需要触摸事件来处理叠加。不管怎样，看一看，做必要的更改就可以了！非常感谢你的帮助。很好的发现。。我以为在“向下”、“向上”和“单击”整个过程后，它会被删除
$(document).on('mousedown', '.toggle',function() {
      console.log("clicked!"); 
      alert("HI");
      $('.pac-container').remove();
});