Mousdedown在形式

Question

多個單選按鈕這工作時，我點擊我的呈白色空間（與.search形式爲類我的整個形式的）

<form name="form" method="POST" action="/api/search.php" class="search-form" id="search-form"> 
    <input type="radio" name="role" data-role="wanted_specialty" value="1" class="radio-btn"><span class="overlay"></span> 1</label> 
    <input type="radio" name="role" data-role="wanted_specialty" value="2" class="radio-btn"><span class="overlay"></span> 2</label> 
    <input type="radio" name="role" data-role="wanted_specialty" value="3" class="radio-btn"><span class="overlay"></span> 3</label> 
</form> 




var form = document.querySelector('.search-form'); 
    form.addEventListener('mousedown',function(e){ 
    // DO SOMETHING 
    }); 

但它不工作時除了「.search-form」之外，我使用完全相同的代碼，然後由所有單選按鈕的類改變。

我該如何做到這一點，因此，只要點擊了任何單選按鈕（或未點擊），「DO SOMETHING」就能發揮作用。它應該是一個帶有單選按鈕的過濾系統，可以實時更新數據庫中有多少結果。

Answer 1

Firefox瀏覽器不支持MouseDown。

https://developer.mozilla.org/fr/docs/Web/Events/mousedown

的addEventListener只能的元件上使用，而不是在一個元件組。

嘗試是這樣的：

var form = document.getElementById('search-form'); 
[].forEach.call(form.childNodes, function(item, iterator){ 
    item.addEventListener('mousedown', function(e){ 
    //DO Something 
    alert('click'); 
    }); 
}); 

https://jsbin.com/kusuyacoyo/edit?js,output