Php 通过hashchange+加载内容；基于不在哈希中的文件名的jquery

我使用的是来自ben alman的jquery+hashchange插件。下面是获取哈希名称并加载内容的标准方法

$(window).hashchange(function() {
var hash = location.hash;
var array_url = hash.split('#');
var page = $(array_url).last()[0];
$('#content').load( page + '.php', function(){
});
});

但是，有没有办法通过抓取在click函数上分配的或通过php排序的其他变量来做到这一点呢

我正在与一个多艺术家的投资组合网站合作，该网站向图像分发独特的三个四个字母的代码

我想通过独特的URL提供这些图片。出于许多原因，这必须通过ajax实现

我很难添加其他ajax历史记录选项，因为该页面已经在使用ajax分页（加载此内容）和大量htaccess url修改

我想这可能是不可能的

这是我目前的代码

$('a.photo').click(function () {
    var url = $(this).attr('href'),
    image = new Image();
    image.src = url;
    var clickedLink = $(this).attr('id');
    location.hash = clickedLink;
    image.onload = function () {
         $('#content').empty().append(image);
    };
    image.onerror = function () {
       $('#content').empty().html('That image is not available.');
    }
    $('#content').empty().html('Loading...');
    return false;
});

$(window).hashchange( function(){
    var hash = location.hash;
    var url = ( hash.replace( /^#/, '' ) || 'blank' );
    document.title = url;
})

$(window).hashchange();

和我的html/php：

$thethumb = customuniqueidfunc();

<a href="[IMG URL]" 
class="photo gotdesc nohover" rel="<?php echo $row['description'] ?>" 
id="<?php echo $thethumb; ?>">

$thethumb=CustomUniquedFunc（）；
我以前使用过的一种方法是运行哈希轮询函数。您可以在此页面上看到它的实际操作：


以下是该页面的javascript：


相关代码：

function pollHash() {

    //exit function if hash hasn't changed since last check
    if (window.location.hash==recentHash) {
        return; 
    }
    //hash has changed, update recentHash for future checks 
    recentHash = window.location.hash;

    //run AJAX to update page using page identfier from hash 
    initializeFromUrl(recentHash.substr(1));

}

$(document).ready(function(){

    /* code removed for readability */ 

    setInterval('pollHash()',100); // Important piece

    /* code removed for readability */


});

及

[编辑：]如果您可以创建一个只从数据库输出图像位置的页面，那么以下是您的页面的完整代码

var recentHash = "";
var image_url ="";

$(document).ready(function() {

    $('a.photo').click(function (event) {
        var clickedLink = $(this).attr('id');
        location.hash = clickedLink;

        event.preventDefault();
    });


    setInterval('pollHash()',100);

});

function pollHash() {

    //exit function if hash hasn't changed since last check
    if (window.location.hash==recentHash) {
        return; 
    }
    //hash has changed, update recentHash for future checks 
    recentHash = window.location.hash;

    //run AJAX to update page using page identfier from hash 
    initializeFromUrl(recentHash.substr(1));

}


//AJAX function to update page if hash changes
function initializeFromUrl(fromLink) {

    /* code removed for readability */


    //take hash from function call or from the URL if not
    input = fromLink || window.location.hash ;

    //remove # from hash
    output = input.replace("#","");



    //get the URL of the AJAX content for new page
    pageId = output;
    if(pageId != ""){
        var temp_url = 'http://whitecu.be/user/mountain/'+pageId+'.html';
        $.get(temp_url, function(data) {

            image_url = data;
            image = new Image();
            image.src = image_url;

            image.onload = function () {
                $('#content').empty().append(image);
            };
            image.onerror = function () {
                $('#content').empty().html('That image is not available.');
            }
            $('#content').empty().html('Loading...');       

        });



    }else{

        window.location = "http://whitecu.be/user/mountain";

    }

}

我不知道你具体要求什么，或试图做什么。你能澄清一下你的目标吗？抱歉-我正在尝试用ajax加载内容，它是可书签的，带有后退按钮，使用hashchange，但将hashchange挂起以获得另一个变量，一个不是hash的变量。。。我希望这能帮上忙，但恐怕不行。那么你具体需要什么帮助呢？您是否需要帮助将其设置为可书签/历史友好型？另外，您是否需要帮助“连接hashchange以获取另一个变量”？如果是，什么变量，你说的“获取”是什么意思？我想帮助你我只需要澄清这些事情，谢谢你的解释。@JonathonG嘿，希望你仍然有帮助的心情：）我需要帮助的是触发hashchange将内容加载到一个div中，而不是基于hash，但在另一个变量上，就像您所说的那个样——在php中生成的唯一id存储在链接的IDattr中。最终使用-用户单击图像（使用href attr=img和id attr=id），href img在div中加载，id attr在hash中加载。您可以在Thanke上看到上面的代码示例！是的，还在心情。我会努力的，很快会回复你的。非常感谢你的帮助！不过我还是有点困惑。我理解pollhash函数，它每运行100毫秒寻找一个新的哈希。但是这是什么
pageId=output
，什么是
输出
我只是直接从脚本中发布代码，删除了一些内容。您可以替换$（“hiddenContent”）.fadeout…然后使用当前代码将图像加载到div中。我已经在回答中为您完成了这项工作，但您可能需要对其进行一些调整，我希望这能帮助您了解如何使用它。@user1061301如果您这样做，您实际上可以从.click（）中删除该内容只要对散列进行更改，轮询函数就会在看到散列更改时处理其余部分。（这种情况发生得太快，用户不会注意到延迟）再次感谢您的帮助！不幸的是，我还没有完全弄明白。我添加了这个click函数，但是当我更改散列，甚至手动键入它时，什么都没有发生。我在initializeFromUrl函数中添加了一个警报，但它从未触发，这使我认为它没有被调用…
$（'a.photo'）。单击（函数（事件）{var clickedLink=$（this.attr（'id'）；location.hash=clickedLink；event.preventDefault（）；}）；
你能在stackoverflow聊天室和我聊天吗？
var recentHash = "";
var image_url ="";

$(document).ready(function() {

    $('a.photo').click(function (event) {
        var clickedLink = $(this).attr('id');
        location.hash = clickedLink;

        event.preventDefault();
    });


    setInterval('pollHash()',100);

});

function pollHash() {

    //exit function if hash hasn't changed since last check
    if (window.location.hash==recentHash) {
        return; 
    }
    //hash has changed, update recentHash for future checks 
    recentHash = window.location.hash;

    //run AJAX to update page using page identfier from hash 
    initializeFromUrl(recentHash.substr(1));

}


//AJAX function to update page if hash changes
function initializeFromUrl(fromLink) {

    /* code removed for readability */


    //take hash from function call or from the URL if not
    input = fromLink || window.location.hash ;

    //remove # from hash
    output = input.replace("#","");



    //get the URL of the AJAX content for new page
    pageId = output;
    if(pageId != ""){
        var temp_url = 'http://whitecu.be/user/mountain/'+pageId+'.html';
        $.get(temp_url, function(data) {

            image_url = data;
            image = new Image();
            image.src = image_url;

            image.onload = function () {
                $('#content').empty().append(image);
            };
            image.onerror = function () {
                $('#content').empty().html('That image is not available.');
            }
            $('#content').empty().html('Loading...');       

        });



    }else{

        window.location = "http://whitecu.be/user/mountain";

    }

}