Javascript 无法为从Ajax调用加载的html加载css/js_Javascript_Html_Css_Ajax_Cgi

Javascript 无法为从Ajax调用加载的html加载css/js

javascript html css ajax

Javascript 无法为从Ajax调用加载的html加载css/js,javascript,html,css,ajax,cgi,Javascript,Html,Css,Ajax,Cgi,我正在为一个非常小的应用程序使用CGI脚本，在这个应用程序中，我从文本框向DB发送请求，接收一些数据并将其显示在同一网页上。我为文本框页面提供了以下HTML： <html> <head> <title>Text Search</title> <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> &l

我正在为一个非常小的应用程序使用CGI脚本，在这个应用程序中，我从文本框向DB发送请求，接收一些数据并将其显示在同一网页上。我为文本框页面提供了以下HTML：

<html>
<head>
<title>Text Search</title>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css">
<script type="text/javascript">
    function xmlhttpPost() {
        var xmlHttpReq = false;
        var self = this;
        if (window.XMLHttpRequest) {
            self.xmlHttpReq = new XMLHttpRequest();
        }
        else if (window.ActiveXObject) {
            self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
        }
        self.xmlHttpReq.open("POST", "test2.py", true);
        self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        self.xmlHttpReq.onreadystatechange = function() {
            if (self.xmlHttpReq.readyState == 4) {
                updatepage(self.xmlHttpReq.responseText);
            }
        }
        self.xmlHttpReq.send(getquerystring());
    }
    function getquerystring() {
        var form = document.forms["search_form"];
        var word = form.word.value;
        qstr = 'q=' + escape(word);
        alert(qstr);
        return qstr;
    }
    function updatepage(str){
        alert(str);
        document.getElementById("result").innerHTML = str;
    }
    $(function() {
        $( "#tabs" ).tabs();
    });
</script>
</head>
<body>
<form name="search_form">
    <p>
        Query: <input name="word" type="text">
        <input value="Submit" type="button" onclick='JavaScript:xmlhttpPost()'>
    </p>
    <div id="result">
    </div>
</form>
</body>
</html>


文本搜索
函数xmlhttpPost（）{
var xmlHttpReq=false；
var self=这个；
if（window.XMLHttpRequest）{
self.xmlHttpReq=新的XMLHttpRequest（）；
}
else if（window.ActiveXObject）{
self.xmlHttpReq=新的ActiveXObject（“Microsoft.XMLHTTP”）；
}
self.xmlHttpReq.open（“POST”，“test2.py”，true）；
self.xmlHttpReq.setRequestHeader（'Content-Type'，'application/x-www-form-urlencoded'）；
self.xmlHttpReq.onreadystatechange=函数（）{
if（self.xmlHttpReq.readyState==4）{
updatepage（self.xmlHttpReq.responseText）；
}
}
self.xmlHttpReq.send（getquerystring（））；
}
函数getquerystring（）{
var form=document.forms[“search_form”]；
var word=form.word.value；
qstr='q='+转义（word）；
警报（qstr）；
返回qstr；
}
函数更新页（str）{
警报（str）；
document.getElementById（“结果”）.innerHTML=str；
}
$（函数（）{
$（“#制表符”）.tabs（）；
});

查询：

我一提交文本，就会收到一个

…

类似的消息

<table width=100% height=100%>
<tr>
<td width=80%>
<div id="tabs" style="width: 1200px;">
    <ul>
<li><a href="#tabs-151802">donald</a></li></ul>
<div id="tabs-151802">

<div id="1" class="151802">
<h2>1.  Index of World War II articles (D) - Wikipedia, the free encyclopedia</h2><br>
<a href=http://en.wikipedia.org/wiki/Index_of_World_War_II_articles_(D) target="_blank">http://en.wikipedia.org/wiki/Index_of_World_War_II_articles_(D)</a><br><br>
</div>
<hr>
</div>

</div>
</td>
<td width=20% valign="top" style="font-size: initial;">
</td>
</tr>
</table>




1.第二次世界大战文章索引（D）-维基百科，免费百科全书

从显示在

之间的

test2.py

。应用程序运行良好，但我无法让CSS/JS为我收到的内容工作！我希望在查询页面中使用与HTML中相同的脚本（js/css）

如果我在没有ajax调用的情况下呈现页面，css/js将正常工作

更新：

我注意到CSS没有被加载。现在可以忽略javascript。

style.css

有

字体系列

和

字体大小

用于

正文

。这些都没有加载。

当前页面中的

css/js

在哪里？@RayonDabre在第一部分中有两个

和一个

。这些是我希望使用的

css

文件，您添加的文件只是为

body

设置样式。我是否应该将css/js链接添加到从ajax加载的html内容中？这是不必要的。对于

js

，加载外部

DOM

后，需要初始化所需的方法