通过AJAX加载页面并显示标题

时间:2011-09-07 作者:Daniel Sachs

一次小规模的、可能很简单的咨询。我通过Ajax加载页面,如下所示:

jQuery("div.menu a").addClass("ajax");     
var hash = window.location.hash.substr(1);
var href = jQuery(\'.ajax\').each(function(){
    var href = jQuery(this).attr(\'href\');
    if(hash==href.substr(0,href.length-5)){
        var toLoad = hash+\'.html #wrapper\';
        jQuery(\'#wrapper\').load(toLoad)
    }                                           
});
jQuery(\'a.ajax\').click(function(){                        
    var toLoad = jQuery(this).attr(\'href\')+\' #wrapper\';
    jQuery(\'h2\').fadeOut(\'slow\');
    jQuery(\'#wrapper\').animate( {
      top: \'300px\',
      opacity: 0
    } ).animate({top:\'-300px\'}).hide(\'normal\',loadContent);

    window.location.hash = jQuery(this).attr(\'href\').substr(0,jQuery(this).attr(\'href\').length-5);

    function loadContent() {
        jQuery(\'#wrapper\').load(toLoad,\'\',showNewContent())
    }
    function showNewContent() {

        jQuery(\'#wrapper\').show(\'slow\').animate( {
          top: \'0px\',
          opacity: 1
        } );
        jQuery(\'h2\').fadeIn(\'slow\');
    }
    return false;
});
在这样做的同时,我还将当前页面的标题显示在标题处。php通过echo get_the_title(); . 显然,此功能没有更新,我的问题是:Is there a way to fetch the title of the page loaded via Ajax?

2 个回复
SO网友:Michael Watts
//data stores the ajax response
var matches = data.match(/<title>(.*?)<\\/title>/);
var pageTitle = matches[1];
document.title = pageTitle;
SO网友:onokazu

我假设您想将获取页面的标题设置为h2?像下面这样更改单击处理程序怎么样?

jQuery(\'a.ajax\').click(function(){                        
    var toLoad = jQuery(this).attr(\'href\');
    jQuery(\'h2\').fadeOut(\'slow\');
    jQuery(\'#wrapper\').animate( {
      top: \'300px\',
      opacity: 0
    } ).animate({top:\'-300px\'}).hide(\'normal\',loadContent);

    window.location.hash = jQuery(this).attr(\'href\').substr(0,jQuery(this).attr(\'href\').length-5);

    function loadContent() {
        jQuery.get(toLoad, function(data) {
            jQuery(\'#wrapper\').html(data.find(\'#wrapper\')).show(\'slow\').animate( {
              top: \'0px\',
              opacity: 1
            } );
            jQuery(\'h2\').text(data.find(\'title\').text()).fadeIn(\'slow\');
        });
    }

    return false;
});

结束

相关推荐

启动AJAX生成的表单的TinyMCE按钮

如果我按照有关如何为短代码添加tinyMCE按钮的教程进行操作(例如:http://www.garyc40.com/2010/03/how-to-make-shortcodes-user-friendly/ )如果我在thickbox中创建一个启动表单的按钮,则始终会有以下代码来创建启动的表单:// executes this when the DOM is ready jQuery(function(){ // creates a form to be displ