Question

我有一个网站菜单，使用一小部分jQuery将HTML页面的特定部分加载到当前页面，ID为'guts'。我希望菜单在访问期间保持不变，而“胆量”就是这一切。 URL也会随函数更改。

我在大多数桌面浏览器上都能正常工作，但在移动设备上却没有。内容淡入淡出，因此脚本部分执行，但未引入正确的内容，并且URL保持不变。

我很新，并且认为这是某种语法错误。非常感谢任何帮助。谢谢。

我的代码：

$(document).ready(function() {

    var newHash      = "",
        $mainContent = $("#content-wrap"),
        $el;



    $("#menu a").click(function(event) {
        event.preventDefault();
        var _link = this.href;
        $mainContent
                .fadeOut(1000, function() {
                    $mainContent.hide().load(_link + " #guts", function() {
                        $mainContent.fadeIn(1000);
                        window.history.pushState(null, null, _link);
                        $(window).trigger("pathchange");
                        });
                    });
        return false;

    });

});

Answer 1

我会以完全不同的方式做到这一点：

$(document).ready(function() {

var newHash      = "",
    $mainContent = $("#content-wrap"),
    $el;



$("#menu a").on("click tap", function(event) {

    var _link = $(this).attr('href');


    $mainContent.fadeOut(1000);

    // Sends GET request to _link + "#guts" with empty arguments({})
    // And after it does the stuff with htmlData =(response) in callback func.        
    $.get(_link + "#guts", {}, function(htmlData) {

           // Waits for fadeout function
           while($mainContent.attr('display') != 'none') {}

           // Fills the content of $mainContent div with response data
           $mainContent.html(htmlData);

           // Does your stuff           
           $mainContent.fadeIn(1000);
           window.history.pushState(null, null, _link);
           $(window).trigger("pathchange");
    } 
}

希望它会起作用:) 祝你好运。

Answer 2

您提供的网站链接不是响应式网站，因为它可以在所有设备中正常显示。

这对您http://www.w3schools.com/html/html_responsive.asp有助于您的网站响应。

你的jQuery代码没有错误。

jquery没有在手机上工作

2 个答案: