如何排除<；a>；从Javascript OnClick函数开始，这样链接本身就可以工作了？

我有一个功能，可以在用户单击某个产品时为其添加边框（用于比较功能）。目前，只要他们点击框内的任何东西，就会突出显示，这很好。但是，我只想排除书名，它也是书下的链接，这样当他们点击书名（链接）时，他们会被带到另一个页面

另外，我如何将功能限制为仅单击3次？目前，他们可以突出显示任意数量的书籍

为产品生成的HTML代码：

<div class='col-md-3 col-sm-4 col-xs-12'>
  <div class='product' data-id='19' data-title='Book 19''>
    <center>
      <img class='img-responsive' src='admin_area/product_images/book-19.jpg' style='margin-top: 5%;'>
    </center>
    <div class='text' style='text-align: center;'>
      <center>
        <a href='https://edubookenhancement.com/book/148927379x'> Book 19 </a>
      </center>
    </div>
  </div>
</div>

如果要排除指向指针事件的元素，可以将其添加到CSS中

pointerEvents: none 

如果要限制元素上的单击次数，请执行以下操作：

您可以执行以下操作：


//用于计算点击次数
var计数=0；
$（“.product”）。在（'click'，函数（e）上{
e、 预防默认值（）；
//如果已经有课了
if（$（this）.closest（'.product'）.hasClass（“比较”））{
$（this）.closest（'.product'）.removeClass（“比较”）；
//递减计数
计数=计数-1；
}else if（count重写Swati的答案，以确保在错误实例中没有触发错误

$selectedItems = $('.compare').length;
if ($selectedItems < 4) {
    $(".product").on('click', function(e) {

      //IE Friendly Prevent Default
      if(typeof e.preventDefault == 'function'){
          e.preventDefault();
      } else {
          e.returnValue = false;
      }

      $(this).closest('.product').toggleClass('compare');
    }
} else {
    alert("Cannot select more then 3 product");
}

$selectedItems=$（'.compare'）.length；
如果（$selectedItems<4）{
$（“.product”）。在（'click'，函数（e）上{
//IE友好防止违约
如果（e.preventDefault的类型=='function'）{
e、 预防默认值（）；
}否则{
e、 returnValue=false；
}
$（this）.closest（'.product'）.toggleClass（'compare'）；
}
}否则{
警报（“不能选择超过3种产品”）；
}

此方法将计算有多少元素具有compare类，除非少于4个元素，否则无法触发compare功能

正如使用
e.preventDefault（）
发出警告一样，将导致脚本不在IE中运行。请确保为此功能实施IE回退。
您应该检查触发单击的事件。如果目标不是
a
标记，请执行逻辑，否则让链接自行执行操作

下面是香草Javascript


var products=document.querySelectorAll（“.product”）；
对于（变量i=0；iif（document.queryselectoral（“.product.selected”）.length您是否可以发布在浏览器中为
产品
生成的html，以便易于理解。@Swati我已经添加了代码！以后请添加足够的代码来复制此问题，您没有提供任何JavaScript。每个问题也只问一个问题，这里有两个问题：如何在上不使用事件处理程序de>a
标记以及如何确保只选择三个项目。它们是两个非常不同的问题，一个不相关的问题。在CSS中将指针事件设置为“无”基本上会取消该功能。您不能再单击产品以突出显示它，链接仍然不起作用。您需要将指针事件“无”添加到需要添加的元素中避免点击，而不是整个点击，在这种情况下，这只会使链接不可点击。太好了，谢谢！还有什么方法在点击时不突出显示框吗？实际上，这也不允许我通过再次点击来删除一本书，它被注册为“已选择”.以前我可以选择一本书，然后再次单击取消选择。而在这里，如果它将其注册为“选择”因此，在第3次单击时，警报显示upRemove the count and if and else语句，只保留toggle类。然后添加一个检查，查看有多少元素具有类名比较，并将toggle移动到少于4个类的if语句中（）@对不起，现在检查一下，我以前没有注意到。不用担心，我发布了一个答案，只是为了让提问者更容易回答。@Swati