safari与chrome浏览器select标签点击事件差异及解决方案
在网页开发中，为select下拉菜单添加事件监听器（例如onclick）以响应用户选择，在不同浏览器中表现可能存在差异。本文探讨了Safari浏览器与Chrome浏览器下select标签点击事件的差异，并提供了解决方案。
问题描述：
在Chrome浏览器中，使用onclick事件监听器可以正常工作，但在Safari浏览器中，onclick事件无法触发。 以下是一个示例代码片段，演示了这个问题：
HTML结构 (部分示例，省略了不相关部分):
JavaScript代码 (使用jQuery):
$(document).on('click', '#first_tower_select', function() {
let project_id = $("#first_project_select").val();
if (project_id) {
getBuilding(project_id);
}
});
解决方案：
Safari浏览器在select元素获得焦点时会触发onfocus事件，而不会像Chrome那样可靠地触发onclick事件。因此，一个有效的解决方法是使用onfocus事件代替onclick事件：
$(document).on('focus', '#first_tower_select', function() {
let project_id = $("#first_project_select").val();
if (project_id) {
getBuilding(project_id);
}
});
通过使用onfocus事件，可以确保代码在Safari和Chrome浏览器中都能正常运行，提升代码的浏览器兼容性。 这是一种常见的解决方法，可以避免因浏览器差异导致的事件监听失败。
