PHP & JS - 在页面上附加 html 和脚本
[英]PHP & JS - append html and scripts on page
问题描述
I'm using an ajax call to append a MVC partial view with some styles sheets and script files to my php page.
我正在使用 ajax 调用将带有一些样式表和脚本文件的 MVC 部分视图附加到我的 php 页面。
However it is not appending de <script> tags.但是它没有附加 de <script>标签。 I already checked my HTTP request on the network and it really brings those tags.我已经在网络上检查了我的 HTTP 请求，它确实带来了这些标签。
My code:我的代码：
$.ajax({
type: 'POST',
url: 'http://localhost:63322/MyController/MyAction', //external url project
data: JSON.stringify(parameters),
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: true,
crossDomain: true,
processdata: true,
headers: {
"Access-Control-Allow-Origin" : "*",
"Access-Control-Allow-Headers": "*"
},
success: function(result){
$(".pageContainer").html(result);
},
error: function(er){ alert('Error'); }
});
On ajax success function I already tried:在 ajax 成功功能上，我已经尝试过：
- to use
$(".pageContainer").empty().append(result)使用$(".pageContainer").empty().append(result) - to separate the script tags and add to
<head>like this:分离脚本标签并添加到<head>像这样：
var elems = $(result); var scripts = $.grep(elems, function(e){ try{ return e.tagName.toLowerCase() == "script"; }catch(er){ return false; } }); var remainElems = $.grep(elems, function(e){ try{ return e.tagName.toLowerCase() != "script"; }catch(er){ return false; } }); $.each(scripts, function(){ $('head')[0].appendChild(this); }); $(".pageContainer").append(remainElems);
to give some time before appending with
setTimeout(function(){ $(".pageContainer").html(result); }, 1000);在附加setTimeout(function(){ $(".pageContainer").html(result); }, 1000);之前给一些时间to change
<script>tags to<link type="text/javascript" src="http://someurl.com" rel="tag"/>and it was appended but the code wasn't executed将<script>标签更改为<link type="text/javascript" src="http://someurl.com" rel="tag"/>并且它已附加但未执行代码
But nothing works.但没有任何作用。
What is wrong?怎么了？ What I'm missing?我缺少什么？
My PHP page uses jquery-1.8.3 and jquery-ui-1.9.2.custom.我的 PHP 页面使用 jquery-1.8.3 和 jquery-ui-1.9.2.custom。 This is the problem?这就是问题？
NOTE:笔记：
My question is very different from that on: Executing inside retrieved by AJAX我的问题与上面的问题大不相同： 在 AJAX 检索的内部执行
If you read both you will see they are very different.如果您阅读两者，您会发现它们非常不同。 I already readed what and noticed that.我已经读过什么并注意到了。
2 个解决方案
解决方案1
0 已采纳 2018-02-16 14:21:47
Solved.解决了。 I don't know why but seems jquery-1.8.3 don't performs the insertion of the <script> tags to the html code dynamically.我不知道为什么，但似乎 jquery-1.8.3 不会动态地将<script>标签插入到 html 代码中。
I changed我变了
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
to到
<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
and now it works.现在它起作用了。
解决方案2
-1 2018-02-16 14:32:58
I found the problem: that old version of jQuery stumbles over the </script> in the html it's supposed to append.我发现了问题：旧版本的 jQuery 偶然发现了它应该附加的 html 中的</script> 。 If you mask the slash however, it works:但是，如果您屏蔽斜线，它会起作用：
<\/script>
DEMO:演示：
var result = '<p>Hello</p><script>function test() { return "hello!";} <\\/script>'; $(".pageContainer").html(result); console.log(test());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <div class="pageContainer"></div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.