javascript - 单击 <a> 文本以检查输入

标签 javascript jquery bootstrap-4

我如何确保当我点击 <a> 中的文本时复选框被激活?现在,当有人单击复选框的文本时,下拉菜单将关闭。 这是一个简单的片段:

<div id="divChooseMacro" class="dropdown-menu" aria labelledby="choose-macro">
    <a class='dropdown-item' data-value='pippo' style='cursor: pointer;'> 
        <input type='checkbox' value='pippo'/>&nbsp; pippo 
    </a>
</div>

我尝试设置一个 cursor: pointer在标签 <a>但没有成功

最佳答案

我建议您使用 label 标记将其与复选框相关联。此外,我在您的代码中插入了一些不同的语义标记:您可以随意将其改回。

关于下拉关闭,你可以停止点击事件在复选框切换它的检查时传播,这样点击的引导事件监听器就不会被触发

<ul id="divChooseMacro" class="dropdown-menu" aria labelledby="choose-macro">
  <li class='dropdown-item' data-value='pippo' style='cursor: pointer;'> 
    <label class='dropdown-item' onclick='event.stopPropagation();'> 
      <input type='checkbox' value='pippo'/>&nbsp; pippo 
    </label>
  </li>
</ul>

关于javascript - 单击 <a> 文本以检查输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52205087/

相关文章:

javascript - 服务器端渲染与客户端渲染以及网站以前如何在 Angular 工作之前工作

javascript - 最新的jquery日期选择器,更改默认日期

c# - 使用 Ajax 以 guid 作为键的 .NET MVC 字典绑定(bind)问题

javascript - jQuery 更改事件被调用两次

reactjs - Bootstrap 下拉菜单不适用于 React 路由器

html - YouTube嵌入式视频自定义缩略图到完整视频

javascript更改隐藏值然后提交表单

javascript - API Connect - 包含基本 Javascript 时出现 500 错误

JavaScript - 如何从另一个函数停止一个函数的工作

javascript - Bootstrap 4 标签输入 - 仅从预定义列表中添加标签