Question

我的网站上有一个脚本，并使用jQuery使variation-value div元素可以点击。

不幸的是p＆amp; div代码无法点击。对此有一个简单的解决方法吗？

jsfiddle example ::: http://jsfiddle.net/xb4qkdLu/ :::

<div class="variation-value">
    <p class="left" style="background:green">left aligned text</p>
    <div class="right" style="background:red">right aligned text</div>
    <p></p>
</div>

Answer 1

我在你之后发布的jsfiddle中看到的是，你将点击绑定到td类（variation）中的$('.variation').on('click', 'td', function(event){...元素。

根据您所写的内容以及我在原始帖子下留下的评论，将点击触发器监听器挂钩到.variation-value'课程将为您解决此问题（因为您目前没有任何事件与它）。

如果您想补充原始脚本，您可能需要使用一些CSS“hack”，在td中添加p和span的CSS以下{ {1}}（需要一些额外的IE微调），或者你也可以将pointer-events:none;中的其他元素添加到触发器监听器。

代码示例：

CSS就像（考虑正常情况下的浏览器）：

td

Jquery将是：

.variation-value > p, .variation-value > div { pointer-events:none; }

请记住，如果$('.variation-value').on('click', function(event){ ... }元素可见，则left元素必须重置您的值列表（未找到right元素的任何触发器集）。如果要为.variation-values中的所有元素启用点击效果，则会丢失绑定到左侧元素的重置效果。这肯定是你想要达到的目标吗？如果是这样，只需使用上面的CSS代码段，您就可以按照自己的意愿使用它。

另外需要注意的是，在HTML标记中，您将元素放在以下层次结构中：

div.variation-value
    p[left]
        div[right]

您没有关闭p元素，然后在div添加正确的元素，使其成为p的子元素。我假设你应该关闭p标签以确保按预期的功能。

Answer 2

http://jsfiddle.net/hasecbinusr/pctgs5ke/

$(document).ready( function(e) {
  $('.variation-value').click(function () {
    alert('You clicked it!');
  });
});

使整个DIV块可单击

2 个答案: