1

我有一个这样声明的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被声明为post-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 错误,说“对象已执行”,并且在 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 将与此相反

4

2 回答 2

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");

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

于 2013-04-19T20:43:26.830 回答
0

问题

<a href="javascript:void(0);" onclick="switchViews(... etc浏览器遇到的地方,该函数 switchViews是存在还是未定义

回答

代码定义switchViews出现在后面,所以当时switchViewsundefined

解决方案

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

于 2013-04-19T21:17:44.453 回答