我试图通过JQuery load()方法加载页面内容。这是代码
$(window).ready(function() {
$('#content').load('views/login.html');
});.mdl-layout {
align-items: center;
justify-content: center;
}
.mdl-layout__content {
padding: 24px;
flex: none;
}<link href="https://code.getmdl.io/1.3.0/material.indigo-blue.min.css" rel="stylesheet" />
<script src="https://code.getmdl.io/1.3.0/material.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="mdl-layout mdl-js-layout mdl-color--grey-100">
<main class="mdl-layout__content" id="content">
</main>
</div>（抱歉，我无法将login.html添加到代码段编辑器。这是一个由mdl框架强大的登录表单：/）
现在，来自mdl的表单元素的Javascript函数无法正常工作。开发人员控制台中没有错误。我还尝试在jquery加载请求后重新加载我的所有javascript文件？
有谁知道我的脚本出了什么问题？
如果您提供的代码是从.html文件中复制的，那么结构就不好了。这是工作版本：
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<style>
.mdl-layout {
align-items: center;
justify-content: center;
}
.mdl-layout__content {
padding: 24px;
flex: none;
}
</style>
<link href="https://code.getmdl.io/1.3.0/material.indigo-blue.min.css" rel="stylesheet" />
<script src="https://code.getmdl.io/1.3.0/material.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="mdl-layout mdl-js-layout mdl-color--grey-100">
<main class="mdl-layout__content" id="content">
</main>
</div>
<script type="text/javascript">
$(window).ready(function() {
$('#content').load('views/login.html');
});
</script>
</body>
</html>
CSS样式需要用标签括起来，并且必须在标签内关闭Javascript代码希望这对您有所帮助。
我自己解决了这个问题。这里的解决方案：
我只是再次在load方法之后调用mdl javascript。
$.getScript('https://code.getmdl.io/1.3.0/material.indigo-blue.min.css');
现在它完美无缺。谢谢大家！