你如何从不同的目录中使用ajax？

Question

首先，让我向您展示文件夹结构：

public_html[]  
     |_ project_folder[]  
            |_another_folder[]  

            |_xml_folder[]  
                   |_xmlfile.xml   

            |_ js_folder[]  
                   |_javascriptfile.js  

            |_ file.html  
            |_ file2.html

我有一些file.html和file2.html在文档加载时加载使用jQuery ajax。 Ajax使用以下代码：

$(document).ready(function()
{
    $.ajax({
        type: "GET",
        url: "xml/xmlfile.xml",
        dataType: "xml",
            ...
            ...
            ...
}

当在文件的根目录中找到HTML文件时（这就是它们现在的方式），这些工作正常

现在，当我将html文件移动到文件夹（例如，将file2.html移动到another_folder）时，加载xml文件不再起作用了。 请注意，我已经在html上更改了必要的src标签，即：从src \\“js / javascriptfile.js”到src = \\“../ js / javascriptfile.js”。

我没有改变的是javascript文件中的“url”。 现在，XML没有加载，因为它试图在它自己的目录（another_folder / xml / xmlfile.xml）上查找XML文件，而不是从它所在的根目录中查找。

我的问题是，为了避免这个问题应该怎么做？

Answer 1

在js文件中使用绝对URL，例如

'/project/xml/xmlfile.xml'

如果你想要它更普遍，你还可以做其他事情，比如阅读当前网址并从中构建ajax网址。

更新：回复评论您可以如何生成正确路径的示例。 如果项目始终是第一个子目录，那么这应该可以构建正确的URL。

function xml_url(){
var first_dir_regexp = /https?:\/\/[^\/]+\/([^\/]+)\/.+/;
matches = first_dir_regexp.exec(document.location.toString());
return matches[1]+"/xml/xmlfile.xml";
}
//...
xml_url()

此代码使用regexp来提取url的第一个目录，并将/xml/xmlfile.xml附加到其中。

例如，如果页面是example.com/project1/awesome/index.html，则返回example.com/project1/xml/xmlfile.xml

请注意，此代码非常脆弱，您可能希望为其添加一些检查。 这只是一个例子。

如果你的项目深度超过一个级别，你应该考虑添加一些配置设置，让javascript更多地了解它运行的环境。

Answer 2

使用相对于Web根目录的URL，而不是当前目录。

$(document).ready(function()
{
    $.ajax({
        type: "GET",
        url: "/xml/xmlfile.xml", // note the leading slash
        dataType: "xml",
            ...
            ...
            ...
}

Answer 3

由于我讨厌重复代码，我也遇到了同样的问题。

我这样想出来：

我的目录结构：

include_db/
  dbconnect.php
main_project/
  shared_code/
    ajax/
      ajax_script.php
    shared_js.php
  sub_project/
    sub_index.php
  index.php

请注意，我在.php文件中真的有javascript！ 我会解释为什么降低。

从index.php我包含共享java声明：

<script type="text/javascript" src="./shared_code/shared_js.php"></script>

从sub_index.php我这样做：

<script type="text/javascript" src="../shared_code/shared_js.php?path=."></script>

shared_js.php文件使用的是AJAX，所以这就是为什么它是.php而不是.js ：

$.ajax({
  url: ".<?php echo $_GET[path]; ?>/shared_code/ajax/ajax_script.php",
  ...

因为我必须根据我从哪里调用它来改变该ajax脚本的路径。 这就是我在index.php或sub_index.php中设置的$ _GET [path]变量的内容。

AJAX脚本ajax_script.php然后再次使用相对于自身的路径，因此它将具有您通常会做的事情：

<?php
    require("../../../include_db/dbconnect.php");