呈现来自Ajax调用（HTML和/或JS）的任何响应 [英] Render any response from ajax call (HTML and/or JS)

问题描述

我想知道可能来自ajax调用的最有效的方法是什么。响应可以是html和/或javascript

我用document.write（）来完成它，因为ajax调用是同步的。现在我必须使用异步调用，所以我不能只使用document.write写入页面，当调用完成时，我必须将内容添加到特定的html对象。

  $ jQuery.ajax（{
 url：myURL.ashx，
 data：params，
 success：function（data）{
 var newdiv = document.createElement（'div'）; 
 newdiv.innerHTML = data; 
 document.getElementById （'target'）。appendChild（newdiv）; 
} 
  

但它没有为任何返回的javascript工作，它很容易被破坏（这意味着它不渲染内容，或者它在新标签中显示内容时会出现奇怪的现象）我只是为了简单的场景而工作

我想知道是否还有比这更好的方法。

谢谢！

编辑

例如，此代码无法按预期工作，它呈现内容在空白页面上而不是将内容添加到当前页面。我正在使用FF 3.6进行测试。为了简单起见，我正在对 str var中的javscript进行编码，但是该脚本是从服务器返回的。服务器返回的内容是ADS，内容是动态的，并且是完全随机的。

  var str =< sc+ ript language = \JavaScript \type = \text / javascript\>; 
 str + =document.write（'< scr'+'ipt language = \JavaScript\src = \anything.js\type = \text / javascript\ >< \ / scr'+'ipt>'）;; 
 str + =< \ / script>; 
 var newdiv = document.createElement（'div'）; 
 newdiv.innerHTML = str; 
 document.getElementById（'target'）。appendChild（newdiv）; 
  

解决方案

：

 成功：函数（数据）{
 $（'< div />'）
 .append（data）
 .appendTo（'＃target'）; 
} 
  

您必须解释$ b $的含义b

不适用于任何JavaScript
返回

如果数据中有< script> 标签如果您使用上面演示的 jQuery.append 函数，jQuery将在全局范围内评估它们。

更新

只要移除 document.write 语句即可。

 < code>< code> document.write < code>< ; script src =anything.jstype =text / javascript>< / script> 
  

I wonder what's the most effective way to render ANYTHING that might come from an ajax call. The response can be html and/or javascript

I was doing it with document.write() since the ajax call was sync. Now I have to use async calls so I can't just write to the page using document.write, I have to add the content to a specific html object when the call finished.

I tried this

   $jQuery.ajax({
   url: "myURL.ashx",
   data: params,
   success: function(data){
        var newdiv = document.createElement('div');
        newdiv.innerHTML = data;
        document.getElementById('target').appendChild(newdiv);
   }   

but it doesn't work for any javascript returned, it get easily broken (this means; it doesn't render the content or it does weird things as showing the content in a new tab). I just work for simple scenarios.

I wonder if there is any better approach that works better than this.

Thanks!

EDIT

This code, for example, doesn't work as expected. It renders the content on a blank page instead of adding the content to the current page. I'm testing with FF 3.6. For simplicity, I'm harcoding the javscript on str var, but that script is returned from the server. The content returned by the server are ADS, the content is dynamic and totally random.

        var str = "<sc" + "ript language=\"JavaScript\" type=\"text/javascript\">";
        str += "document.write('<scr'+ 'ipt language=\"JavaScript\" src=\"anything.js\" type=\"text/javascript\"><\/scr' + 'ipt>');";
        str += "<\/script>";
        var newdiv = document.createElement('div');
        newdiv.innerHTML = str;
        document.getElementById('target').appendChild(newdiv);    

解决方案

Well the jQuery equivalent of what you have there would be:

success: function(data){
    $('<div />')
        .append(data)
        .appendTo('#target');
}

You will have to explain what you mean by

doesn't work for any javascript returned

for a better answer.

If there are any <script> tags within data jQuery will evaluate them in the global scope if you use the jQuery.append function as I demonstrated above.

Update

Just remove the document.write statement. Only use document.write when the page is still loading.

<script src="anything.js" type="text/javascript"></script>

这篇关于呈现来自Ajax调用（HTML和/或JS）的任何响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！