I have checkbox insde a link. In all browsers except Chrome, when clicking on the checkbox you follow the link (instead of just having the checkbox become selected).

我有一个链接的复选框。在所有的浏览器中,除了Chrome,当点击复选框时,点击链接(而不是选中复选框)。

How do I avoid this behaviour?

我如何避免这种行为?

Demo (hover over one of the product images to see the checkbox):

演示(将鼠标悬停在一个产品图像上,以查看复选框):

  • http://livedemo07571.prestatrend.com/category.php?id_category=9
  • http://livedemo07571.prestatrend.com/category.php?id_category=9

And here’s the code in question:

这里有一个问题的代码:

<a href="http://livedemo07571.prestatrend.com/product.php?id_product=25" class="product_img_link">
    <img src="http://livedemo07571.prestatrend.com/img/p/25-65-large.jpg" height="469" width="469" alt="Crew Neck Jumper" />

    <span class="new">New</span>

    <div class="right_block large">
        <h3 class="large">Crew Neck Jumper</h3>

        <span class="product_arrow"></span>
        <p class="availability_container"><span class="availability">Available</span></p>

        <span class="slash">&#47;</span>
        <p class="price_container"><span class="price" style="display: inline;">$2,390.00</span></p>

        <p class="compare large"><input type="checkbox" class="comparator" id="comparator_item_25" value="comparator_item_25" /> <label for="comparator_item_25">Select to compare</label></p>
    </div>
</a>

3 个解决方案

#1


8

This isn't valid HTML (see report). The way to avoid this is, quite simply, to include only text or images inside an anchor tag, and move the checkbox outside. You could use some jQuery to add a click event to the box which would navigate to the next page.

这不是有效的HTML(参见报告)。避免这种情况的方法很简单,就是在锚标记中只包含文本或图像,并将复选框移出。您可以使用一些jQuery将单击事件添加到将导航到下一页的框中。

更多相关文章

  1. 组合两个下拉菜单以确定提交按钮链接
  2. Wordpress网站上的亚马逊链接无法正确打开亚马逊应用程序
  3. 创建mailto超链接,该超链接将在Outlook中打开,并在主体中显示超链
  4. 图像未加载到HTML页面的jQuery load()中
  5. 为什么v-align中的将文本放在图像下面
  6. 如何将带有图形链接的列表转换为内联列表?
  7. 获取图像特定区域的所有多边形坐标?
  8. 180225-第一百零七天【html链接,头部】
  9. 如何在网站中找到未使用的图像和CSS样式?

随机推荐

  1. Android入门
  2. 精灵游戏实现
  3. Android中view重绘问题
  4. [Android]笔记19:RatingBar的功能与用法
  5. Android NDK学习笔记
  6. Android实现自动填充验证码
  7. Android修改主机名和IP地址问题
  8. Android(安卓)pulltorefresh上拉下拉刷新
  9. Android(安卓)开发最佳实践
  10. android 升级包制作