窗口加载时未触发警报
Alerts not firing on window load
我已经在Firefox,IE和Chrome中尝试过,并且使用以下代码,我的警报都没有触发。 无论是在页面加载时还是在我单击图像时。 我对 JavaScript 非常陌生,但真的很欣赏它在用户体验方面的强大功能。 我真的很想更好地学习它,希望你们中的一个人能够帮助我理解为什么这行不通...... 我将包含完整的 HTML,因为我听说 JScript 在选择器和 DOM 对象方面可能非常挑剔。 我也不知道如何在JavaScript中正确抛出错误... :(
<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
function preview(img, selection) {
alert("firedTwo");
}
$(document).ready(function () {
alert("firedThree");
});
$(window).load(function () {
alert("fired");
});
</script>
<link href="../css/style.css" rel="stylesheet" type="text/css" />
<link href="../css/profile.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="favicon.ico" >
<link rel="apple-touch-icon" href="apple-touch-icon.png" >
<title>CityGuru.ca - Saskatoon: Profile Editor</title>
</head>
<body>
<h1>Profile Picture Upload</h1>
<div id="subHeader">Upload Picture</div>
<div id="subContainer">
<h2>Create Thumbnail</h2>
<div align="center">
<img src="../images/users/saskatoon/1/photo.jpg" style="float: left; margin-right: 10px;" id="thumbnail" alt="Create Thumbnail" />
<div style="border:1px #e5e5e5 solid; float:left; position:relative; overflow:hidden; width:60px; height:60px;">
<img src="../images/users/saskatoon/1/photo.jpg" style="position: relative;" alt="Thumbnail Preview" />
</div>
<br style="clear:both;"/>
<form name="thumbnail" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post">
<input type="hidden" name="x1" value="" id="x1" />
<input type="hidden" name="y1" value="" id="y1" />
<input type="hidden" name="x2" value="" id="x2" />
<input type="hidden" name="y2" value="" id="y2" />
<input type="hidden" name="w" value="" id="w" />
<input type="hidden" name="h" value="" id="h" />
<input type="submit" name="upload_thumbnail" value="Save Thumbnail" id="save_thumb" />
</form>
</div>
<hr />
<h2>Upload Photo</h2>
<form name="photo" enctype="multipart/form-data" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post">
Photo <input type="file" name="image" size="30" /> <input type="submit" name="upload" value="Upload" />
</form>
</div>
</body>
</html>
注意使用FireFox的Web控制台时,我得到的唯一JS错误是:
$ 未定义
$() 语法是 jQuery,而不是原生 JavaScript。(尽管其他一些库也使用相同的语法)。你需要包含jQuery才能正常工作。
在
head部分的脚本标签中添加此 http://code.jquery.com/jquery-latest.js 上面的代码中没有jQuery,所以$(document.ready(function()不起作用
尝试执行以下操作:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function preview(img, selection) {
alert("firedTwo");
}
...
</head>
需要注意的重要事项:
- 你没有引用jQuery:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
- 你有点把事情弄乱了...
首先,像这样的脚本通常会出现在脑海中。
其次,你不应该把JavaScript放在文档类型之前。
第三,我没有看到你的开始头标签,只有结束标签。
最后,你需要在头部的某个地方包含一个jquery脚本。
相关文章:
- 页面显示前加载Javascript警报
- 基于url的加载警报框的脚本
- 如何在页面完成重新加载后执行甜蜜警报
- 返回并重新加载页面时显示不需要的服务器端警报消息
- Jquery 将内容加载到 ajax 容器中,并在完全完成时发出警报
- 加载表单时在警报框中显示父联系人任务
- 在 PHP 中调用 javaScript 警报后,重新加载页面将不起作用
- 如何防止在按键关闭事件警报框后重新加载页面
- 获取更新面板原因在页面加载事件中回发
- 窗口加载时未触发警报
- 使用 jQuery 将 XML 加载到 JS 变量中,而不带 JS 警报
- JS 函数在页面重新加载时激活警报
- 为什么使用 ajax 加载时警报函数不起作用
- 加载程序之前的网站发丹
- 如何在页面重新加载后显示消息或警报
- 为什么我的警报不会在页面加载时显示,但如果我立即执行,它会显示
- 如何在用JavaScript重新加载页面后显示警报
- 将确认警报从Node/Express发送到浏览器,而无需重新加载页面
- JS和PHP-在从JS发出信号后加载PHP数据,而不发送回发
- Titanium:警报加载