Question

我正在使用ajax加载reCaptcha。从其他页面返回的内容中的一行是下面的行，当我使用div

时，该行不会加载到我的$(.cap).html(callBack);中

这是

行

<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n"></script>

这是jQuery不允许的吗？或者我做错了什么？我怎么解决这个问题？如何将jquery从另一个页面返回到我的<div>？

我正在测试的内容很简单：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>No Tile</title>

<script type="text/javascript" src="http://localhost/site/scripts/jQuery.js"></script>

<style type="text/css">
.user {
    cursor: pointer;
}
</style>

<script type="text/javascript">
$(document).ready(function() {
    //$(".user").live("click",function() {
    $(".user").click(function() {

        data = "id=Hello"

        $.ajax({
              type:"GET",
               url:"demo.php",
              data:data,
          dataType:"html",

        beforeSend:function(html){

        },

        success: function(callBack){
            $(".cap").html(callBack);

            console.log(callBack);
        },

        error: function(page_data){

        },

        });

    });
});
</script>
</head>
<body>

<div id="container">

<div class="cap">Hello</div>

<span class="user">Add User</span>
</div>

</body>
</html>

这是从其他页面返回的行不会加载到div。

<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n"></script>

返回的整个数据

<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n"></script>

    <noscript>
        <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n" height="300" width="500" frameborder="0"></iframe><br/>
        <textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
        <input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
    </noscript>

Answer 1

即使是字符串格式，也无法返回“脚本”标签。这是因为javascript的工作方式。但是你可以让你的demo.php脚本返回json。你应该自己看看，但我不相信有另一种方法可以轻松地做到这一点。（好吧，更糟糕的做法，你可以只返回一个字符串并解析它的值但是......）。无论如何，如果你假设你以下列格式返回一个json对象，你可以复制粘贴你的成功函数中的其余对象并将对象名称改为'callback'...

var json = {
    type: "text/javascript",
    scriptSrc: "http://www.google.com/recaptcha/api/challenge?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n",
    id: "theFrame",
    iframeSrc: 'http://www.google.com/recaptcha/api/noscript?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n'
};

var script = document.createElement('script');
script.type = json.type;
script.src = json.scriptSrc;

$('<iframe>', {
   src: json.iframeSrc,
   id:  json.id,
   frameborder: 0,
    height: 300,
    width: 500
   }).appendTo('.cap');

jsFiddle：http://jsfiddle.net/vT3Ug/1/

Answer 2

实际上可以呈现javascript标记。例如html5 boilertemplate使用它来查看它是否应该加载本地或来自CDN的jQuery。

<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

正如您所看到的，如果您注入脚本标记，则需要转义结束脚本标记<\/script>。

另一方面，你不能这样做

<noscript>
    <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n" height="300" width="500" frameborder="0"></iframe><br/>
    <textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
    <input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
</noscript>

只是因为您没有iframe来源，您的iframe将无法呈现。

但你可以这样做：

callBack = callBack.replace('</script','<\/script')
                   .replace('<noscript>','')
                   .replace('</noscript>','');

$('body').append(callback);

使用Jquery ajax时，如何附加<script> </script>以及从其他页面返回的其他数据？

2 个答案: