JS Accordion在点击里面的链接时关闭

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (77)

在点击accordion下拉列表中的链接时,我遇到了保持accordion打开的问题。这是一个职业页面,当我打开单个作业时,我希望用户能够在新选项卡中打开该应用程序。有任何想法吗?

https://www.trinovainc.com/careers.html

<div class="accordion">
  <div class="accordion-panel careers" data-id="panel-1">
    <div class="accordion">
      <h4><a class="accordion-title">Application Engineer - Mobile, AL<span class="ion-chevron-down"></span></a></h4>
    </div>
    <div class="accordion-panel-content panel-1">
      <p>TriNova is looking for an energetic and personable candidate who is a self-motivated and well-organized professional to join our team as an Application Engineer.</p>
      <h4>Summary</h4>
      <ul>
        <ul>
          <li>Provides in-depth product and application knowledge for TriNova and customers; specifically providing inside sales support for account managers. Duties to include reviewing of specifications, verifying model codes, quoting, ordering, expediting and communicating with the customer and sales force.</li>
        </ul>
      </ul>
      <h4>PRIME RESPONSIBILITIES</h4>
      <ul>
        <ul>
          <ul>
            <li>Review all types of applications that consist of but not limited to: sizing valves, choosing instruments, sizing gamma, sizing flowmeters and creating electrical &amp; PID drawings for various types of field instrument panels.</li>
            <li>Review specifications and provide model codes for products.</li>
            <li>Perform CAD drawings of best practice installation and wiring</li>
            <li>Communicate with the customer, outside salespeople, manufacturers and the Area Vice President.</li>
            <li>Understand commercial issues and terms.</li>
            <li>Field visits with account managers for relationship development, training and as required to optimize the order process and achieve customer satisfaction</li>
            <li>Improve product and technical knowledge.</li>
            <li>Troubleshooting of basic device issues.</li>
          </ul>
        </ul>
      </ul>
      <h4>MINIMUM EDUCATION</h4>
      <ul>
        <ul>
          <ul>
            <li>Bachelor&rsquo;s Degree in Engineering.</li>
            <li>Minor in Sales Engineering is a plus</li>
          </ul>
        </ul>
      </ul>
      <h4>TRAVEL</h4>
      <ul>
        <ul>
          <ul>
            <li>Occasional travel required.</li>
          </ul>
        </ul>
      </ul>
      <h4>PREVIOUS JOB EXPERIENCE</h4>
      <h4>Desired:</h4>
      <ul>
        <ul>
          <ul>
            <li>Previous related experience of at least 2 years</li>
          </ul>
        </ul>
      </ul>
      <h4>Required:</h4>
      <ul>
        <ul>
          <li>None</li>
          <ul></ul>
        </ul>
      </ul>
      <a class="button orange apply" href="https://www.trinovainc.com/job-application.html" target="_blank">Apply Now</a>
    </div>
  </div>
</div>
提问于
用户回答回答于

使用event.stopPropagation()

在Javascript中,您有事件冒泡,这意味着每当为元素触发事件时。那个事件会冒泡到所有的父元素。这意味着如果你有accordion的onlick关闭它,你点击它内部的按钮(或其他任何东西),它将关闭。您可以使用以防止这种情况event.stopPropagation()。这将阻止事件传播DOM结构。

例:

function prop(e){
  console.log(e.currentTarget);
}

function notProp(e){
  console.log(e.currentTarget);
  e.stopPropagation();
}
 
<div id="propagated" onclick="alert('Bubbled')"><button onclick="prop(event)">Click</button></div>

<div id="notpropagated" onclick="alert('OH NO')"><button onclick="notProp(event)">Click</button></div>

热门问答

请问bugly上报的服务器是在哪?如果要发行海外版本,能把上报服务器调成海外吗?

游戏联机对战引擎实时服务器怎么请求外部接口?

您好,实时服务器支持http访问内网,需要在实时服务器内下载request模块,同时把node_modules文件夹压缩打包上传发布实时服务器。

扩展能力之云调用,小程序端出错:[tcb-js-sdk]参数错误:非法的应用标识?

software微软、谷歌、腾讯、阿里、百度……
推荐
您好,appSign必须是小程序的appid,appSecret的两个字段必须是在云开发控制台-安全来源里配置过的。 image.png ... 展开详请

对象存储, 版本控制,没有提供对象的历史版本列表的查询API吗?

serverless db 如何管理?

Richel码农
推荐
1.支持pg_dump,psql工具进行数据导入和导出。 2.本地CLI,可以使用postgresql的客户端psql,也可以使用dbeavr,navicate,pgadmin等工具访问。 3.支持操作DB ,要自己写逻辑 ... 展开详请

在cos 使用 javascript uploadFiles 函数,报 403,求解?

galenye

腾讯 · 工程师 (已认证)

对象存储专业搬砖工
推荐

可以发一下403时候返回的requestId,我们再帮查询下

所属标签

扫码关注云+社区

领取腾讯云代金券