Javascript函数未定义

时间:2013-04-19 20:22:54

标签: javascript html undefined object-expected

我已经声明了一个html元素:

<div id="taskImage" runat="server">
   <a href="javascript:void(0);" onclick="switchViews('div<%# Eval("proId") %>', 'one');">
      <img id='imgdiv<%# Eval("proId") %>' alt="Click to show/hide tasks" border="0" src="..."/>
   </a>
</div>

并且javascript函数switchViews在html之后声明为:

function switchViews(obj, row) {

      var div = document.getElementById(obj);
    var img = document.getElementById('img' + obj);

    if (div.style.display == "none") {
        div.style.display = "inline";

        img.src = "../../images/icons/delete.png";

    }
    else {
        div.style.display = "none";

        img.src = "../../images/icons/add.png";

    }

}

当我点击html元素时,我会抛出一个JS错误,说“Object Exepcted”,并且在google chrome脚本调试器中它表示switchViews未定义。为什么会认为switchViews是未定义的,我将如何修复它?为了记录,我已经尝试使用在html之前声明的javascript和在href属性中使用switchViews调用,但它们都以相同的方式结束。

编辑:通过post-html和pre-html清除一些内容我的意思是在我写出html元素之前和之后。所以帖子就像

<div>
   <!-- All my html stuff -->
<div>
<script type="text/javascript">
   <!-- All my Javascript -->
</script>

和pre将是相反的

2 个答案:

答案 0 :(得分:0)

您的javascript不应在HTML标记之外声明。它需要在<script>...</script>块内声明,并且该块应放在<html>...</html>块内,通常位于<head>

所以整体结构应该是这样的:

<html>
  <head>
    <script>
       //your JavaScript goes here
    </script>
  </head>
  ...
</html>

还有其他有效的变体,但它们都要求所有内容都在整个<html>标记内。

如果满足,那么你几乎肯定遇到一个问题,你的javascript代码中有错误(如果浏览器无法解析函数,那么它保持未定义)或者你有一个命名冲突(如果你有多个函数设置为相同的名称,或者如果你的函数与你的一个html元素的id同名,那么它通常会导致一个未定义的错误。)

您必须自己检查命名冲突,但是您可以通过注释掉所有代码并将其替换为以下内容来确认是否是javascript错误:alert("this works");

然后,您可以一次将代码添加回一行,直到警报无法触发(当然,确保始终具有匹配的parens /括号)。如果失败,您将发现错误。

答案 1 :(得分:0)

问题

在浏览器遇到<a href="javascript:void(0);" onclick="switchViews(... etc的时候,功能 switchViews是否存在或未定义

答案

定义switchViews的代码出现在之后,因此当时switchViews 未定义

解决方案

<script>放在 HTML 的其余部分之前,或者将事件监听器附加到 JavaScript 而不是内联。这可以通过addEventListener或使用 jQuery 来完成,并且可能需要您遍历感兴趣的 HTMLElements