Question

我是JavaScript的新手（几小时前刚刚开始尝试让脚本运行）。当我将它直接粘贴到我的HTML中时，我浏览了W3的几个教程，并且'hello world'代码正常工作但是我遇到了脚本问题（我遇到了其他脚本的问题）同样但我不确定我做错了什么。

我想要在我的HTML中测试这个code，我复制了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>

edit.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?并且一直试图在最后一小时解决这个问题，但看不出我的问题。

Answer 1

<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>

Answer 2

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

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

将您的代码放在此函数中：

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

或者像这样：
```
$(function(){
    /*CODE HERE*/
});
```

在您使用DOM之前，需要准备好DOM。将代码放在DOM的ready事件上执行的匿名函数中是如何执行此操作的。

修改

$(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); }); });

Answer 3

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

Answer 4

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

未定义的ReferenceError $未定义

4 个答案: