如何触发单击以打开下拉列表答案

【问题标题】：how can I trigger click to open a dropdown如何触发单击以打开下拉列表
【发布时间】：2019-10-02 14:55:09
【问题描述】：

我需要一个下拉菜单才能在不手动点击的情况下打开。我尝试了很多东西，其中包括。

setTimeout(()=>{
  document.getElementById("mydropdown").click();
},5000)


<select id="mydropdown">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="2">3</option>
</select>

但它不起作用。我能做什么？

这是我的实时代码：

https://stackblitz.com/edit/angular-xinu88?file=src%2Fapp%2Fapp.component.html

【问题讨论】：

我看了 - HTMLSelectElement 上似乎没有任何方法可以打开下拉列表，正如您所发现的，.click() 没有打开它。
@GreyBeardedGeek 是的...

标签： angular

【解决方案1】：

不幸的是，通常无法从 JS 中打开选择/选项，但您可以创建自定义下拉菜单，如 this link。您的代码正确调用了点击事件，如果您在下面添加此代码，您可以看到它：

你的 .html：

<select id="mydropdown" (click)="onClick($event)>
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="2">3</option>
</select>

你的 .ts：

  ngOnInit(): void {
     let dropdown: HTMLElement = document.getElementById('mydropdown') as 
      HTMLElement;
      setTimeout(() => {
        dropdown.click();
      }, 5000);
  }

  onClick(event) {
    console.log('occured!');
  }

【讨论】：

获取子元素引用的更标准 Angular 方法是通过 @ViewChild 注释。
是的，但在这种情况下，我想让答案类似于问题约定。但感谢您的建议。
@MostafaSaadatnia 这行得通吗？ this.test(dropdown) 是什么？
@yavg click event 在此示例中引发，但不幸的是，无法模拟对 javascript/typescript 文件下拉菜单的真实点击。