为什么在 Safari 浏览器中 select 标签点击事件无法触发？-html教程-PHP中文网

为什么在 Safari 浏览器中 select 标签点击事件无法触发？

花韻仙語

发布： 2024-11-04 15:00:29

原创

683人浏览过

为什么在 Safari 浏览器中 select 标签点击事件无法触发？

select 标签在 safari 浏览器中无法触发点击事件的解决办法

在 Web 开发中，有时需要在点击下拉列表框 (select) 元素时执行某些操作。但在某些情况下，开发人员可能会遇到 select 标签在 Chrome 中可以正常触发点击事件，但在 Safari 浏览器中却无法触发的现象。

要解决此问题，可以使用 onfocus 事件代替 onclick 事件。onfocus 事件会在输入字段或其他可获取焦点的元素获得焦点时触发。因此，可以在 onfocus 事件中执行原本打算在点击事件中执行的操作。

慧中标AI标书

慧中标AI标书是一款AI智能辅助写标书工具。

120

查看详情

以下代码演示了如何替换 onclick 事件为 onfocus 事件：

<div class="building_select">
  <div class="select_building">
    <div class="left_cent">
      楼栋
    </div>
    <select class="tower_select" id="first_tower_select">
      <optgroup disabled hidden></optgroup>
      <option value="0">全部</option>
    </select>
    <div class="select_room">
      <div class="left_cent">房号</div>
      <select class="n_select" id="first_storey_select">
        <optgroup disabled hidden></optgroup>
        <option value="0">全部层</option>
      </select>
      <select class="n_select" id="first_room_select">
        <optgroup disabled hidden></optgroup>
        <option value="0">全部房</option>
      </select>
    </div>
  </div>
</div>

登录后复制

$(document).on('focus', '#first_tower_select', function () {
  let project_id = $("#first_project_select").val();
  if (project_id) {
    getBuilding(project_id);
  }
});

登录后复制

以上就是为什么在 Safari 浏览器中 select 标签点击事件无法触发？的详细内容，更多请关注php中文网其它相关文章！