Question

我有一个带历史记录支持的ajax功能，但我想从链接加载页面内容。

这是我的index.html

<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<script src="jquery.tools.min.js"></script>
<link rel="stylesheet" type="text/css" href="tabs-no-images.css"/>
</head>
<body>
<ul class="css-tabs">
  <li><a href="ajax1.htm">Tab 1</a></li>
  <li><a href="ajax2.htm">Second tab</a></li>
  <li><a href="ajax3.htm">An ultra long third tab</a></li>
</ul>

<div class="css-panes">
  <div style="display:block"></div>
</div>

<script>
  $(function() {
      $("ul.css-tabs").tabs(
      "div.css-panes > div",
      {effect: 'ajax', history: true}
    );
    });
</script>
</body>
</html>

和我的css

/* root element for tabs  */
ul.css-tabs {
    margin:0 !important;
    padding:0;
    height:30px;
    border-bottom:1px solid #666;
}

/* single tab */
ul.css-tabs li {
    float:left;
    padding:0;
    margin:0;
    list-style-type:none;
}

/* link inside the tab. uses a background image */
ul.css-tabs a {
    float:left;
    font-size:13px;
    display:block;
    padding:5px 30px;
    text-decoration:none;
    border:1px solid #666;
    border-bottom:0px;
    height:18px;
    background-color:#efefef;
    color:#777;
    margin-right:2px;
    position:relative;
    top:1px;
    outline:0;
    -moz-border-radius:4px 4px 0 0;
}

ul.css-tabs a:hover {
    background-color:#F7F7F7;
    color:#333;
}

/* selected tab */
ul.css-tabs a.current {
    background-color:#ddd;
    border-bottom:1px solid #ddd;
    color:#000;
    cursor:default;
}


/* tab pane */
.css-panes div {
    display:none;
    border:1px solid #666;
    border-width:0 1px 1px 1px;
    min-height:150px;
    padding:15px 20px;
    background-color:#ddd;
}

和jquery.tools.min

我有三个包含ajax内容的文件夹。

我希望，当用户转到index.html页面时，他们可以将任何页面的内容（ajax1.htm或..）视为默认内容。所以我的问题是如何通过添加额外的代码来使用我当前的代码呢？

请描述要编辑的内容以及放置外部代码的位置。

评论代码：

$(function() {
    var current_hash = false;
    setInterval(function() {
        if (window.location.hash != current_hash) {
            current_hash = window.location.hash;
            $('#content').load("ajax1.htm?page=" + current_hash);
        }
    }, 100);
});

Answer 1

顺便说一句，我找到了解决问题的方法。我使用jquery地址主，这解决了我的问题。但另一个问题到了，jquery冲突。
我用左 mootools-yui-compressed.js（对于固定菜单，仅固定在一个轴上）
jquery.address-1.5.min.js（用于ajax地址主函数）
jquery-ui-1.8.13.custom.min.js（用于ajax地址主函数）
jquery.js（用于ajax地址主函数）

和第一个（mootools-yui-compressed.js）和最后一个（jquery.js）相互冲突。我试过了

jQuery.noConflict();

但它不起作用。
请帮忙。

如何在ajax中将内容显示为默认值？

1 个答案: