用Ajax来控制书签和回退按钮的代码(2)

window.onload = initialize; 

function initialize() {
  // initialize the DHTML History
  // framework
  dhtmlHistory.initialize();

然后，开发者使用dhtmlHistory.addListener()方法去订阅历史改变事件。这个方法获取一个javascript回调方法，当一个DHTML历史改变事件发生时他将收到2个自变量，新的页面地址，和任何可选的而且可以被关联到这个事件的历史数据。

复制代码 代码如下:

window.onload = initialize; 
function initialize() {
  // initialize the DHTML History
  // framework
  dhtmlHistory.initialize();

  // subscribe to DHTML history change
  // events
  dhtmlHistory.addListener(historyChange);

historyChange()方法是简单易懂得，它是由一个用户导航到一个新地址后收到的新地址(newLocation)和一个关联到事件的可选的历史数据historyData 构成的。

复制代码 代码如下:

/** Our callback to receive history change
     events. */
function historyChange(newLocation, 
                       historyData) {
  debug("A history change has occurred: "
        + "newLocation="+newLocation
        + ", historyData="+historyData, 
        true);
}

上面用到的debug()方法是例子代码中定义的一个工具函数，在完整的下载例子里有。debug()方法简单的在web页面上打一条消息，第2个Boolean变量，在代码里是true,控制一个新的debug消息打印前是否要清除以前存在的所有消息。

　　一个开发者使用add()方法加入历史事件。加入一个历史事件包括根据历史的改变指定一个新的地址，就像"edit:SomePage"标记, 还提供一个事件发生时可选的会被存储到历史数据historyData值.

复制代码 代码如下:

window.onload = initialize; 

function initialize() { 
  // initialize the DHTML History 
  // framework 
  dhtmlHistory.initialize(); 

  // subscribe to DHTML history change 
  // events 
  dhtmlHistory.addListener(historyChange); 

  // if this is the first time we have 
  // loaded the page... 
  if (dhtmlHistory.isFirstLoad()) { 
    debug("Adding values to browser " 
          + "history", false); 
    // start adding history 
    dhtmlHistory.add("helloworld",  
                     "Hello World Data"); 
    dhtmlHistory.add("foobar", 33); 
    dhtmlHistory.add("boobah", true); 

    var complexObject = new Object(); 
    complexObject.value1 =  
                  "This is the first value"; 
    complexObject.value2 =  
                  "This is the second data"; 
    complexObject.value3 = new Array(); 
    complexObject.value3[0] = "array 1"; 
    complexObject.value3[1] = "array 2"; 

    dhtmlHistory.add("complexObject",  
                     complexObject); 

在add()方法被调用后，新地址立刻被作为一个锚值显示在用户的浏览器的URL栏里。例如，一个AJAX web页面停留在，调用了dhtmlHistory.add("helloworld", "Hello World Data" 后，用户将在浏览器的URL栏里看到下面的地址

复制代码 代码如下: