.jpg)
safari瀏覽器下select標(biāo)簽點(diǎn)擊事件失效的解決方案
在網(wǎng)頁開發(fā)中，JavaScript事件處理是常見操作，但跨瀏覽器兼容性問題時(shí)有發(fā)生。本文探討Safari瀏覽器下select標(biāo)簽點(diǎn)擊事件失效的問題，并提供解決方案。
問題描述：在chrome瀏覽器中，select標(biāo)簽的點(diǎn)擊事件能正常觸發(fā)，但在Safari瀏覽器中卻失效。 代碼意圖是在點(diǎn)擊樓棟選擇框(#first_tower_select)時(shí)，獲取項(xiàng)目ID，并調(diào)用getBuilding函數(shù)進(jìn)行數(shù)據(jù)請求和更新。
部分代碼片段如下：
html結(jié)構(gòu)：
<div class="building_select"> <div class="select_building"> <div class="left_cent">樓棟</div> <select id="first_tower_select"> <!-- options will be added dynamically --> </select> <div class="select_room"> <div class="left_cent">房號</div> <!-- ... other elements ... --> </div> </div> </div>
JavaScript代碼 (問題代碼):
$(document).on('click', '#first_tower_select', function () { let project_id = $("#first_project_select").val(); if (project_id) { getBuilding(project_id); } }); // ... (代碼片段用于動(dòng)態(tài)添加樓棟選項(xiàng)到select標(biāo)簽)...
在Safari瀏覽器中，點(diǎn)擊#first_tower_select不會(huì)觸發(fā)click事件。
解決方案：使用onfocus事件替代onclick事件。onfocus事件在元素獲得焦點(diǎn)時(shí)觸發(fā)，在Safari瀏覽器中更可靠。
修改后的JavaScript代碼：
$(document).on('focus', '#first_tower_select', function () { let project_id = $("#first_project_select").val(); if (project_id) { getBuilding(project_id); } }); // ... (代碼片段用于動(dòng)態(tài)添加樓棟選項(xiàng)到select標(biāo)簽)...
通過將click事件替換為focus事件，可以有效解決Safari瀏覽器下select標(biāo)簽點(diǎn)擊事件失效的問題，確保代碼在不同瀏覽器下的兼容性。 請注意，HTML結(jié)構(gòu)中已將樓棟選擇項(xiàng)改為
? 版權(quán)聲明
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載。
THE END
.png)
