编辑 - 最新更新
好的，我知道你从 Vivek 那里得到了你的小提琴，但你可能也对此感兴趣。现在我完全了解了您想要实现的目标，这里有一个简短的描述。最佳做法是将 JavaScript 从 HTML 中分离出来，并尽可能避免将 JavaScript 放入 HTML head 和 body。
所以，首先创建三个文件：Test.jsExample.html 和 Test.css。当然，您还需要 jQuery 文件，您只需将其包含在头部中即可。在Example.html 中输入以下代码：
<html>
<head>
<link rel="stylesheet" type="text/css" href="Test.css"/>
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript" src="Test.js"></script>
</head>
<body>
<input type="text" id="test"/><span id="popup"></span>
</body>
</html>
在Test.css 中为弹出的 span 元素添加一些样式（如果您想要固定高度和宽度，添加阴影等，也可以使用除法元素并根据自己的喜好设置样式）：
#popup {
background-color: red;
color: white;
display: none;
}
最后，将以下 JavaScript 代码放入 Test.js：
$(document).ready( function() {
$("#test").keyup( function() {
if($("#test").val().length>5) {
$("#popup").fadeIn();
$("#popup").html("Invalid length. Maximum is 5.");
}
else {
$("#popup").fadeOut();
}
});
});
通过将 JavaScript、CSS 和 HTML 划分为单独的文件，您可以获得更整洁的 HTML，并将样式和客户端逻辑与标记分开。
旧答案
将代码封装在$(document).ready()中。
像这样：
$(document).ready(function() {
document.getElementById('confirm').addEventListener('change', checkFile, false);
approveletter.addEventListener('change', checkFile, false);
});
function checkFile(e) {
if ($('#confirm').val().length > 0) {
alert("txt");
}
}
另外，addEventListener 在 IE8 及更低版本中不可用。您可以使用onchange 事件，如下所示：
$(document).ready(function() {
document.getElementById("confirm").onchange = checkFile;
});
对于 IE8 和更早的版本，有一个类似的方法称为 attachEvent。如果使用attachEvent 方法，它看起来像下面这样：
$(document).ready(function() {
document.getElementById('confirm').attachEvent('change', checkFile);
approveletter.attachEvent('change', checkFile);
});
您也可以按照 Protron 在 cmets 中的建议使用 jQuery.change()：
$(document).ready(function() {
$("#confirm").change(function() {
if ($('#confirm').val().length > 0) {
alert("txt");
}
});
});
当然，没有经典的警报弹出窗口也可以做到这一点。您可以使用 display:none 创建自己的 HTML 分割元素，并在必要时显示它。如果您也需要相关说明，请在 cmets 中给我发一个便条。