2

我正在使用数据文件锚标记将用户保留在 Web 应用程序中。

示例 HTML

<div class="products_content">    
<a data-file="salt.html?v=1"><img src="assets/images/template/salt.jpg" width="125" height="125" /></a>

示例js

$('.products_content a').on('click', function(){
    changePage( $(this).attr('data-file') );
});

click 事件没有触发，我不知道为什么，因为我使用非常相似的 Nav 代码并且它工作正常。

任何帮助将不胜感激。

这是我的changePage函数，不确定是否需要。

function changePage(fileName) {
    $('.content_container').animate({
        opacity: 0
    }, 500, function () {
        $('.content_loading_container').load('assets/content/' + fileName, function () {
            $('.content_container').delay(250).animate({
                opacity: 1
            }, 500);
        });
        if (fileName == 'home.html?v=1') {
            $('.page').addClass('home');
        } else {
            $('.page').removeClass('home');
        }
        if (fileName == 'services.html?v=1') {
            $('.content_container').addClass('services');
        } else {
            $('.content_container').removeClass('services');
        }
    });
}
4

2 回答 2

2
  1. 在 Sample HTML 中，没有</div>，这可能是一个错字；

  2. 您可以尝试委托：

    $(document).delegate('.products_content a', 'click', function(){
    changePage( $(this).attr('data-file') );
    return false;
})
于 2013-02-16T04:49:25.133 回答
1

正如你所拥有的那样，你的代码应该可以工作。

<div class="products_content">    
<a data-file="salt.html?v=1"><img src="assets/images/template/salt.jpg" width="125" height="125" /> </a>

$('.products_content a').on('click', function(){
    alert('click');
});

这是一个小提琴。

正如我在上面所做的那样，将您的 changePage() 代码替换为警报，以确定是单击失败还是 changePage() 中的某些内容失败了。

于 2013-02-16T04:18:17.590 回答