与西纳特拉/ Haml的

通过Haml布局文件生成以下输出和index.haml jQuery的身体负荷内Sinatra与西纳特拉/ Haml的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
    <head> 
    <title>Meeting</title> 
    <meta content='width=device-width, initial-scale=1' name='viewport' /> 
    <script src='http://code.jquery.com/jquery-1.6.4.min.js'></script> 
    <script src='http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js'></script> 
    <link href='http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css' rel='stylesheet' type='text/css' /> 
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js'></script> 
    <script type='text/javascript'> 
     //<![CDATA[ 
     $(document).ready(function() { 
      setTimeout(getUpdate,10000); 
      function getUpdate(){ 
      $("body").load("/"); 
      } 
     }) 
     //]]> 
    </script> 
    </head> 
    <body>Some text</body> 
</html>

我试图做到的是通过调用替换body根/' but if it is an AJAX call, my code at/checks for it and theoretically should only replace what's in body`，但它取代了整个文档。

这里是我的Sinatra & Haml Ruby代码

get '/' do 
    ... set some instance vars to be displayed in index.haml ... 
    haml :index, :layout => (request.xhr? ? false : :layout) 
end

来源

2011-11-22 Johnny Klassy

我不知道什么是 “替换整个文档”。我注意到你正在使用jQuery Mobile库。如果症状是风格或布局消失，我认为问题是jQuery Mobile。

jQuery Mobile会自动修改您的DOM结构。如果你尝试检查的DOM元素在浏览器中，你会看到类似这样的：

<div data-role="page" data-url="/test.html" tabindex="0" 
    class="ui-page ui-body-c ui-page-active" style="min-height: 737px; "> 
    Some text 
</div>

如果更换整个body元素，必定会使得jQuery Mobile的破碎。

另一方面，您不需要使用jQuery load函数进行XHR请求。请看看这个：http://jquerymobile.com/demos/1.0/docs/pages/page-links.html：

要启用动画页面过渡，指向一个外部页面（前为products.html）的所有链接将通过Ajax加载。为了不引人注意地执行此操作，框架解析链接的href以制定Ajax请求（Hijax）并显示加载微调器。所有这一切都由jQuery Mobile自动发生。

如果你使用jQuery Mobile，你应该遵循jQuery Mobile的方式。否则，您可以删除jQuery Mobile并使用您自己的XHR机制。

来源

2011-11-23 15:17:54 miaout17

通过“替换整个文档”，我的意思是当调用jQuery方法时，上面的整个HTML输出被替换为'some text'，没有'html'，'head'，甚至是'script'代码。其实我没有设置jQuery Mobile'div's，所以它不是你描述的问题。 –

你使用什么浏览器？你是如何观察DOM变化的？通过Chrome元素检查器或Firebug？即使你没有设置jQuery Mobile div，它也会自动修改你的DOM结构，只要你加载jQuery的移动javascript。 – miaout17

与西纳特拉/ Haml的

回答

相关问题