Tengo una aplicación Django. En mi página html, tengo un menú desplegable que se llena desde la base de datos cuando hace clic con el mouse sobre él:

 <script> $("#div_id_res_person_1").mousedown(function () { $("#id_res_person_1").empty(); $("#id_res_person_1").append("<option>" + '---------' + "</option>") var value_1 = $("#id_report_division").val(); var value_2 = $("#id_report_sector").val(); var value_3 = $("#id_report_department").val(); var url = $("#PostForm").attr("data-person-url"); console.log("a") $.ajax({ url: url, data: { 'divizija': value_1, 'sektor': value_2, 'odjel': value_3 }, success: function (data) { $("#id_res_person_1").html(data); } }); }); </script>

Console.log se agrega para rastrear lo que está sucediendo. Cuando hago clic en el campo en Chrome, se abre el menú desplegable y se carga con datos, primero console.log. Luego selecciono lo que quiero. Hecho. Entonces solo 1 console.log en total.

Cuando hago clic en el campo en Firefox, la primera vez que presiono obtengo console.log y obtengo el segundo cuando selecciono. ¿Cómo puedo evitar el segundo mousedown al seleccionar datos en el menú desplegable en Firefox?