2

我对 JavaScript 很陌生（几个小时前才开始尝试让脚本正常工作）。我浏览了一些关于 W3 的教程，当我将它直接粘贴到我的 HTML 中时， “hello world”代码可以工作，但是我遇到了一个脚本问题（我也遇到了其他脚本的问题，但我不确定我做错了什么）。

我有这段代码，我想在我的 HTML 中进行测试，我复制了 HTML，它看起来一样，然后我在我的静态文件夹中创建了一个名为的文件edit.js并将 JavaScript 复制到其中（如图所示）。它在页面上没有任何错误，但是当我单击它时没有任何反应。我试图在其中粘贴一个 W3 'hello world'代码并且有效，但这个脚本没有。

我试图检查 Chrome 中的代码，这就是我看到上述错误的地方（在资源选项卡下）。我可以使用 Chrome 打开 js 文件，这让我认为 js 文件可以访问并正确指向，但我不确定如何让它工作。我使用 Jinja2 作为我的模板引擎来呈现 HTML，在我的标题中我有：

<script language="JavaScript" type="text/javascript" src="static/edit.js"></script>

在我的主模板（在所有页面上呈现的模板）中，我有：

<script language="JavaScript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

编辑.js：

（即使将它直接放在我想要使用它的页面上的脚本标记中也不起作用）

$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
   var showNew = $('#changevalue').val();
   $('#altervalue').hide();
   $('#storedvalue').show();
   $('#storedvalue span').text(showNew);
});​

HTML：

（它嵌入在更大的页面中）

    <head>
        <script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
        <script language="JavaScript" type="text/javascript" src="static/edit.js"></script>
    </head>
... my html code..
        <div id="wrapper">
           <div id="container">
              <div id="storedvalue"><span>Hello</span> [<a href="javascript:void(0);" id="editvalue">edit</a>]</div>
              <div id="altervalue" style="display:none;"><input type="text" name="changevalue" id="changevalue" value="Hello"> [<a href="javascript:void(0);" id="savevalue">save</a>]</div>
           </div>
        </div>

我从来没有能够成功运行 W3 上还没有的 JavaScript。即使我看到网上有人说他们对他们来说工作得很好，我也会遇到其他脚本同样的问题。我需要做任何额外的事情来完成这项工作吗？

我的两个问题是：

  • 我究竟做错了什么？
  • 因为 Javascript 在出现问题时似乎无法正常工作，有没有办法获取错误或有关实际错误的信息？

我读了 Uncaught ReferenceError: $ is not defined？在过去的一个小时里一直试图解决这个问题，但看不到我的问题。

4

4 回答 4

3 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

jQuery 的脚本标签应该在您的自定义 javascript 之前。

遵从edit.js

<script type="text/javascript" src="static/edit.js"></script>
于 2012-07-10T01:48:04.813 回答
3

首先，您需要先放置 jQuery 脚本标签。

其次，您需要执行以下操作之一：

  1. 将您的代码放入此函数中：

    $(document).ready(function(){/*CODE HERE*/});

  2. 或者像这样：

    $(function(){
    /*CODE HERE*/
});

DOM 需要准备好才能使用它。将代码放在在 DOM 的就绪事件上执行的匿名函数中就是这样做的。

编辑：

$(function(){
   $('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
   $('#savevalue').click(function(e){
     var showNew = $('#changevalue').val();
     $('#altervalue').hide();
     $('#storedvalue').show();
     $('#storedvalue span').text(showNew);
   });​
});
于 2012-07-10T01:52:37.030 回答
2

尝试删除语言属性..有时对我有用。现在已经过时了..我想

于 2012-07-10T03:35:02.360 回答
0

您需要先包含 jquery，然后才能使用它。

于 2012-07-10T01:50:45.037 回答