0

我在单页网站上有以下代码：

    <section class="block" id="panel1">
    </section>
    <section class="block" id="panel2">
    <div class="loadcontent">
    <div class="vcard">
    [content here]
    <a href="detail1.html">Proceed to detail level1</a>
    </div>
    </div>
    </section>
    <section class="block" id="panel3">
    <div class="loadcontent">
    <div class="vcard">
    [content here]
    </div>
    </div>
    </section>

我正在使用的 jquery 是这样的：

<script>
jQuery(function($) {
                $(".loadcontent").on("click","a",function(ev) {                   
                    ev.preventDefault();
                    var $el = $(this);
                    var $lc = $el.closest(".loadcontent");
                    URLtarget = $el.attr("href");

                    //alert("URL:"+URLtarget+"\nZIndex:"+zindex+"\nATTR:"+$el.className);
                    $.ajax({
                        url: URLtarget, 
                        data: {},
                        type: 'post',
                        error: function(XMLHttpRequest, textStatus, errorThrown){
                            alert('status:' + XMLHttpRequest.status + ', status text: ' + XMLHttpRequest.statusText);
                        },
                        success: function(data){
                            $lc.find(".vcard").fadeOut(1000,function() {                                
                            });                             
                            $lc.append(data);
                        }
                    });
                });
});

在detail1.html我有以下代码：

    <div class="vcard">
    <div><a href="#" class="closeme"> &times; CLOSE </a></div>
    [content here]
    <a href="detail2.html">Proceed to detail level1</a>
    </div>

和 ondetail2.html与 detail1 相同，但具有不同的内容模板（和数据）。当我启动第一个链接时，它可以正常加载 detail1.html，但是当我在 detail1.html 中单击 detail2.html 时，它会导致新页面（ajax 不起作用）。我认为 $.on() 正在“监听”dom 上的每个附加事件，正确的方法是什么？

我也尝试使用另一个 .on 作为.closeme链接，但它不起作用，它引导我到文档的顶部。

任何人都可以解释一下吗？

4

2 回答 2

0

所以实际上我找到了答案，在 SO 上被问到了不同的问题。

而不是$(_selector_).on("click","a",function() { ... }); 它需要$(document).on("click","_selector_ a",function() { ... });

于 2013-03-20T14:50:10.647 回答
0

如果您正在生成<section>块，则不会为它们设置您的事件处理程序。请记住，当您使用on委托时，if 只能将事件处理程序附加到当前存在于 DOM 中的元素。$(document).on()如果您不知道将添加哪些元素，请使用。

于 2013-03-20T14:50:19.147 回答