Инициировать событие изменения, изменив selectedIndex для select без jQuery

Question

Я изменяю selectedIndex выбора через JS. Проблема в том, что это действие не запускает событие изменения или ввода. Как я могу сделать эту работу?

let select = document.getElementById("select");
let p = document.getElementsByTagName("p")[0];
let count=0;

select.addEventListener("change",function(e){
let divEl = document.getElementById("textidk");
count++;
divEl.innerHTML="selectedIndex has been changed"+count;

  //something happens after I change selectedIndex in js
});
document.getElementById("btn").addEventListener("click",function(e){
	select.selectedIndex=2;
    p.innerHTML=select.selectedOptions[0].innerHTML;
});

<p></p>
  <select id="select">
    <option value="0">Select car:</option>
    <option value="1">Audi</option>
    <option value="2">BMW</option>
    <option value="3">Citroen</option>
    <option value="4">Ford</option>
    <option value="5">Honda</option>
    <option value="6">Jaguar</option>
    <option value="7">Land Rover</option>
    <option value="8">Mercedes</option>
    <option value="9">Mini</option>
    <option value="10">Nissan</option>
    <option value="11">Toyota</option>
    <option value="12">Volvo</option>
  </select>
<button id="btn">hello</button>
<div id="textidk"></div>

Answer 1

Вы можете попробовать запустить его вручную, просто позвонив onchange на select при изменении индекса. Как это:

select.onchange();

Или вы можете сделать:

select.dispatchEvent(new Event('change'));