【发布时间】:2017-06-24 02:38:13
【问题描述】:
我在一个文件中有html 和js。我想要两个不同的文件js 和html。
这都在一个文件中(第一种情况),这段代码可以工作:
<html>
<head>
<title>menu</title>
<script src="https://cdn.jsdelivr.net/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"></script>
</head>
<body>
<div class="container">
<h2>Registration</h2>
<form id="commentForm" method="post" action="Servlet" name="add_data">
<label for="username">First Name</label>
<input type="text" name="username" id="username" />
<button type="submit">Register</button>
</form>
<script type="text/javascript">
$(function() {
// Initialize form validation on the registration form.
// It has the name attribute "registration"
$("form[name='add_data']").validate({
// Specify validation rules
rules: {
username: {
required: true,
minlength: 5
}
},
messages: {
username: "Please enter your firstname"
},
submitHandler: function(form) {
form.submit();
}
});
});
</script>
</div>
</body>
</html>
但是当我创建第二个文件 valid.js 并移动所有 JavaScript 代码时,这是行不通的(第二种情况):
<html>
<head>
<title>Меню</title>
<script src="https://cdn.jsdelivr.net/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"></script>
<script src="valid.js"></script>
</head>
<body>
<div class="container">
<h2>Registration</h2>
<form id="commentForm" method="post" action="Servlet" name="add_data">
<label for="username">First Name</label>
<input type="text" name="username" id="username" />
<button type="submit">Register</button>
</form>
</div>
</body>
</html>
而文件valid.js 与html 文件存在于同一文件夹中。这是第一个示例中<script> 块中的代码副本。
$(function() {
$("form[name='add_data']").validate({
rules: {
username: {
required: true,
minlength: 5
}
},
messages: {
username: "Please enter your firstname"
},
submitHandler: function(form) {
form.submit();
}
});
});
HTML 和 JS 文件在同一目录中。可能我需要在 html 中调用我的 js 代码吗?
有我的错误吗?为什么第二种情况不起作用?如何解决这个问题?
【问题讨论】:
-
在$(document).ready(function() {})中添加有效的js函数代码;块。
-
任何控制台错误?
-
在我看来它应该可以工作,如果你所说的一切都是准确的。如果您右键单击并查看源代码,然后单击您的 valid.js,它将带您到文件的文本读出。如果不是,那么您的参考是错误的。 @NagaSaiA,
$(function() {})是 document.ready for jquery 的简写版本。 -
我刚刚创建了 plunker,它运行良好 - plnkr.co/edit/cRUr4AeWGMoJhEv5MRJw?p=preview
-
@Nieminen 提到这似乎是参考错误
标签: javascript jquery html