从XSL文件呈现时,JQuery .load()无法正常工作

时间:2011-10-26 15:49:39

标签: javascript jquery xml xslt

我有一个HTML文件:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>orientation test</title>
    <script language="javascript" type="text/javascript" src="jquery-1.6.4.min.js"></script>
    <script language="javascript" type="text/javascript" src="code.js"></script>
    <script language="javascript" type="text/javascript">
        alert('HI');
        go();
    </script>
</head>
<body>
    <div id="oriented">HI</div>
</body>
</html>

javascript文件“code.js”:

function go() {
    try {
        alert(1);
        $(document).ready(function () {
            $("#oriented").load("data.html #orient", function (response, status, xhr) {
                alert(2);
                if (status == "error") {
                    var msg = "Sorry but there was an error: ";
                    alert(msg);
                }
                else {
                    try {
                        alert($("#oriented").html());
                    }
                    catch (err) { alert(err); }
                }
            });
        });
    } catch (err) { alert('err: ' + err); }
}

var a = setInterval("go();", 3000);
alert('BYE');

XSL文件“main.xsl”:

<?xml version="1.0" encoding="iso-8859-1"?>

<xsl:stylesheet
    version="1.0"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:xsd="http://www.w3.org/2001/XMLSchema"
    xmlns:msws="http://tempuri.org/"
    >

  <xsl:template match="/">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title>orientation test</title>
        <script language="javascript" type="text/javascript" src="jquery-1.6.4.min.js">
          <xsl:text> </xsl:text>
        </script>
        <script language="javascript" type="text/javascript" src="code.js">
          <xsl:text> </xsl:text>
        </script>
        <script language="javascript" type="text/javascript">
          alert('HI');
          go();
        </script>
      </head>
      <body>
        <div id="oriented">HI</div>
      </body>
    </html>
  </xsl:template>

</xsl:stylesheet>

用于启动XSL文件的XML文件:

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="feed.xsl"?>
<Results xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://tempuri.org/">
  <Status>OK</Status>
  <Result>
    <FeedDTO>
    </FeedDTO>
  </Result>
</Results>

要在“data.html”中读取的文件:

<html>
<head>
    <title>test</title>
</head>
<body>
    <div id="orient">OFF</div>
</body>
</html>

强制性的jquery min文件版本1.6.4 .js,我不会在这里显示。

我发现当在Firefox 7.0.1中运行“main.html”文件时,“go()”函数中的alert(2);永远不会触发。以前,我认为只有在渲染main.xml时才会发生这种情况,但我发现现在情况并非如此。

我需要这个JQuery来加载data.html文件的内容并将其放入当前页面中div的内容中,无论当前页面是否是从XSL / XML呈现的。

如何确保$ .load()正确执行? try ... catch没有显示任何错误。

此外,我需要使用本地文件进行此工作,最终此代码将作为iPhone上的本地文件执行。

1 个答案:

答案 0 :(得分:0)

好吧,看来这不会很快得到解决。如果有答案我还没找到。

但是,我已经找到了解决方法......

我放置了一个iframe(样式为完全隐藏)并创建了一个间隔来刷新iframe的'src'属性,其随机值为src url的单个参数。像这样:

<script type="text/javascript">
function reloadFrame()
{
 var t = Math.random();
 $("#loader").attr("src","updatepage.html?t="+t);
}

var a = setInterval("reloadFrame();", 1000);
</script>

<iframe id="loader" src="" style="position: absolute; visibility: none;" />

上面的代码每秒重新加载一次iframe。由于't'参数的随机值导致浏览器向服务器/本地文件发出实际请求,而不是基于匹配前一个iframe src加载的URL而忽略它,因此URL实际上是不同的。