jQuery可以在jsFiddle中使用，但不能在我的计算机上使用 [英] jQuery works in jsFiddle but not on my computer
问题描述
我是jQuery的新手，整日忙于试图确定为什么该脚本在jsFiddle中运行而不是在我的计算机上运行的想法.我没有服务器设置，我只是从桌面在浏览器中启动html.
I'm new to jQuery and have been scratching my head all day trying to determine why this script runs in jsFiddle but not on my computer. I do not have a server setup, I am merely launching the html in my browser from the desktop.
代码在这里可以正常使用: http://jsfiddle.net/9Dubr/164/.但是，当我创建以下html文件时:
The code works fine here: http://jsfiddle.net/9Dubr/164/. However when I create the following html file:
<html>
<head>
<title>this better work</title>
<script src="jquery-latest.js"></script>
<script type="text/javascript">
$('#submit').click(function(){
$('#myfrom').fadeOut("slow", function(){
var dot = $("<div id='foo'>Goodmorning Mr. Patti<br/><br/>Thank you.</div>".hide();
$(this).replaceWith(dot);
$('#foo').fadeIn("slow");
});
});
</script>
<style type="text/css">
#container{
width:342px;
height:170px;
padding:10px;
background-color:grey;
}
#myform{
width:322px;
height:100px;
color:#6F6F6F;
padding: 0px;
outline:none;
background-color:white;
}
#foo{
width:322px;
height:100px;
color:#6F6F6F;
padding: 0px;
outline:none;
background-color:white;
}
#submit{
color:#6F6F6F;
padding: 10px 2px 0px 0px;
margin: 0px 0px 0px 0px;
outline:none;
}
</style>
</head>
<body>
<div id="container">
<div id="myform">
<p> blah blah blah blah blah </p>
<input id="submit" value="send" type="submit"/>
</div>
</div>
</body>
</html>
当我单击提交按钮时，没有任何结果.请帮忙，我已经花了6个小时了.
I get no results when I click the submit button. Please help, I've spent 6 hours on this.
谢谢
推荐答案
您必须在DOM上执行代码.将代码包装在$(function(){ });中此外，您还缺少).
You have to execute the code on DOM ready. Wrap your code in $(function(){ }); Also, you're missing a ).
$(function () {
$('#submit').click(function () {
$('#myfrom').fadeOut("slow", function () {
var dot = $("<div id='foo'>Goodmorning Mr. Patti<br/><br/>Thank you.</div>").hide();
$(this).replaceWith(dot);
$('#foo').fadeIn("slow");
});
});
});
<!DOCTYPE html>
<html>
<head>
<title>This better work</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('#submit').click(function () {
$('#myfrom').fadeOut("slow", function () {
var dot = $("<div id='foo'>Goodmorning Mr. Patti<br/><br/>Thank you.</div>").hide();
$(this).replaceWith(dot);
$('#foo').fadeIn("slow");
});
});
});
</script>
</head>
<body>
<div id="container">
<form id="myform">
<p> blah blah blah blah blah </p>
<input id="submit" value="send" type="submit"/>
</form>
</div>
</body>
</html>
这篇关于jQuery可以在jsFiddle中使用，但不能在我的计算机上使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
