jquery - 在 jQuery 选择器外部单击仍会激活功能

Question

按照 JS Riddle 中的这些步骤来查看问题：

1. 转到http://jsfiddle.net/MjrFC/1/
2. 在结果区域中单击“测试”一词，这将打开第 1 点
3. 您应该只能单击单词 test(point1) 和单词 hey(point2) 但如果单击显示 Hello 的 h1 标签，它会转到第 1 点。

下面的代码

    <div class="contentb">
        <h1>testing hello world</h1>
        <div class="point1">test</div>
    </div>

        point1 = '<div class="contentb"> <h1>Hello</h1><div class="point1"> test</div><div class="point2">Hey</div><h1>World</h1></div>';
        point2 = '<div class="contentb"> <div class="point1"> test</div></div>';

       var className = "Broken";
       $(document).on('click', '.contentb [class]', function () {
           $(this).fadeTo(250, 0.25, function () {
               className = this.className; 
               $('.contentb').html(window[className]); 

               $(this).fadeTo(250, 1.00);

           });
       });

Answer 1

您的point1andpoint2变量不应包含contentbdiv 因为您将 html 附加到具有类的元素contentb

point1 = '<h1>Hello</h1><div class="point2"> test</div><div class="point2">Hey</div><h1>World</h1>';
point2 = '<div class="point1"> test</div>';

var className = "Broken";
$(document).on('click', '.contentb [class]', function () {
    $(this).fadeTo(250, 0.25, function () {
        className = this.className; 
        $('.contentb').html(window[className]); 

        $(this).fadeTo(250, 1.00);

    });
});

演示：小提琴