javascript - HTML Javascript 类 - 函数未启动-6ren

javascript - HTML Javascript 类 - 函数未启动

转载作者：行者123 更新时间：2023-11-30 12:51:54

26

4

在过去的一周里，我一直在自学 HTML 的 Javascript。主要来自w3schools。我正在尝试制作两个函数 - 一个在 body/window onload 事件上运行，然后这将触发更新函数，它将无限期地重复，每 10/100 步。

我基本上是在制作一个将由 Javascript 严格控制的网站。我需要创建此模板，以用于我计划构建的系统(响应式布局 + 内容，可调整屏幕大小)。

初始启动函数不影响任何 div。这是为什么？

<!DOCTYPE html>
<html>
   <head>
      <script>
         //         STARTUP
         function startupClass(classnm)
         {
            // scan through all divs, altering size accordingly.
            classid = document.getElementsByClassName(classnm);

            for(i=0;i<classid.length;i+=1)
            {
               // apply style to each div class
               classid[i].style.position="absolute";
               classid[i].style.width=(screen.availWidth/classid.length);
               classid[i].style.height="300px";
               classid[i].style.top="0px";
               classid[i].style.left=i*(screen.availWidth/classid.length);
               classid[i].style.backgroundColor="#f3f3f3";
            } 

            setTimeout(updateClass(classnm),1);
            }
            // jump to update function (Which then automatically updates, every step)

            //      UPDATE FUNCTION
            function updateClass(classnm);
            {
               setTimeout(updateClass(classnm),10);
            }

            window.onload = startupClass("newclass");
      </script>
   </head>
   <body onload="startupClass('newclass');">
      <div class="newclass"></div>
      <div class="newclass"></div>
      <div class="newclass"></div>
      <div class="newclass"></div>
   </body>
</html>

我可能犯了一个明显的错误，但 window.onload 或 body 标签 onload 都没有触发函数？

如果这是一个明显的错误，请原谅我 - 我是 Javascript 的新手。

回答:

语法有一些错误——首先是在 updateClass() 之后意外放置了分号； {} - 然后 setTimeout() 语法出现错误 - 为“setTimeout(updateClass(classnm),1);”，更改为“setTimeout(updateClass,1,classnm);”。

控制台不再返回任何错误 - 但 div 仍未设置样式。这是因为 startupClass() 函数在放置 div 之前运行!为了解决这个问题，我简单地做了一个非常基本的函数，然后在第一步之后触发了 startupClass 函数:

<head>
<script>
//--------------STARTUP
    function startupClassInit(classnm)
    {
        setTimeout(startupClass,1,classnm);
    }

    function startupClass(classnm)
    {
        // scan through all divs, altering size accordingly.
        classid = document.getElementsByClassName(classnm);
            for(i=0;i<classid.length;i+=1)
            {
                // apply style to each div class
                classid[i].style.position="absolute";
                classid[i].style.width=(screen.availWidth/classid.length)+"px";
                classid[i].style.height="300px";
                classid[i].style.top="0px";
                classid[i].style.left=i*(screen.availWidth/classid.length)+"px";
                classid[i].style.backgroundColor="#AA0000";
            } 
        // jump to update function (Which then automatically updates, every step)
        setTimeout(updateClass,1,classnm);
    }

//--------------UPDATE FUNCTION
    function updateClass(classnm)
    {
        classid = document.getElementsByClassName(classnm);
            for(i=0;i<classid.length;i+=1)
            {

            }
    setTimeout(updateClass,100,classnm);
    }

window.onload = startupClassInit("newclass");
</script>
</head>

这现在工作正常:)感谢大家的建议和帮助。

最佳答案

我真的会说，看看 jQuery。

$(document).ready(function() {
    // some functions
}

这将在页面加载后运行函数或将函数绑定(bind)到元素，因为有时您想向元素添加一些功能，但它们在页面创建期间不存在，但函数已经存在:)

关于javascript - HTML Javascript 类 - 函数未启动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20679087/

26

4

0

文章推荐： javascript - 什么是 document.f.q.focus？

文章推荐： javascript - 使用 d3.js 在鼠标悬停时在圆圈内显示文本

文章推荐： javascript - 使用 requirejs 优化时排除 .svn 文件夹

文章推荐： javascript - 获取之前在 chrome 扩展中设置的徽章文本

详解C语言sscanf()函数、vsscanf()函数、vscanf()函数
C语言sscanf()函数：从字符串中读取指定格式的数据头文件： ?
php - 如何解释at()函数； substr()函数;伪代码中的exist()函数
最近，我有一个关于工作预评估的问题，即使查询了每个功能的工作原理，我也不知道如何解决。这是一个伪代码。下面是一个名为foo()的函数，该函数将被传递一个值并返回一个值。如果将以下值传递给foo函数，
VBS教程：函数-CStr 函数
CStr 函数返回表达式，该表达式已被转换为 String 子类型的 Variant。 CStr(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CSng 函数
CSng 函数返回表达式，该表达式已被转换为 Single 子类型的 Variant。 CSng(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-CreateObject 函数
CreateObject 函数创建并返回对 Automation 对象的引用。 CreateObject(servername.typename [, location]) 参数 serv
VBS教程：函数-Cos 函数
Cos 函数返回某个角的余弦值。 Cos(number) number 参数可以是任何将某个角表示为弧度的有效数值表达式。说明 Cos 函数取某个角并返回直角三角形两边的比值。此比值是
VBS教程：函数-CLng 函数
CLng 函数返回表达式，此表达式已被转换为 Long 子类型的 Variant。 CLng(expression) expression 参数是任意有效的表达式。说明通常，您可以使
VBS教程：函数-CInt 函数
CInt 函数返回表达式，此表达式已被转换为 Integer 子类型的 Variant。 CInt(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-Chr 函数
Chr 函数返回与指定的 ANSI 字符代码相对应的字符。 Chr(charcode) charcode 参数是可以标识字符的数字。说明从 0 到 31 的数字表示标准的不可打印的
VBS教程：函数-CDbl 函数
CDbl 函数返回表达式，此表达式已被转换为 Double 子类型的 Variant。 CDbl(expression) expression 参数是任意有效的表达式。说明通常，您可
VBS教程：函数-CDate 函数
CDate 函数返回表达式，此表达式已被转换为 Date 子类型的 Variant。 CDate(date) date 参数是任意有效的日期表达式。说明 IsDate 函数用于判断 d
VBS教程：函数-CCur 函数
CCur 函数返回表达式，此表达式已被转换为 Currency 子类型的 Variant。 CCur(expression) expression 参数是任意有效的表达式。说明通常，
VBS教程：函数-CByte 函数
CByte 函数返回表达式，此表达式已被转换为 Byte 子类型的 Variant。 CByte(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CBool 函数
CBool 函数返回表达式，此表达式已转换为 Boolean 子类型的 Variant。 CBool(expression) expression 是任意有效的表达式。说明如果 ex
VBS教程：函数-Atn 函数
Atn 函数返回数值的反正切值。 Atn(number) number 参数可以是任意有效的数值表达式。说明 Atn 函数计算直角三角形两个边的比值 (number) 并返回对应角的弧
VBS教程：函数-Asc 函数
Asc 函数返回与字符串的第一个字母对应的 ANSI 字符代码。 Asc(string) string 参数是任意有效的字符串表达式。如果 string 参数未包含字符，则将发生运行时错误。
VBS教程：函数-Array 函数
Array 函数返回包含数组的 Variant。 Array(arglist) arglist 参数是赋给包含在 Variant 中的数组元素的值的列表（用逗号分隔）。如果没有指定此参数，则
VBS教程：函数-Abs 函数
Abs 函数返回数字的绝对值。 Abs(number) number 参数可以是任意有效的数值表达式。如果 number 包含 Null，则返回 Null；如果是未初始化变量，则返回 0。
VBS教程：函数-FormatPercent 函数
FormatPercent 函数返回表达式，此表达式已被格式化为尾随有 % 符号的百分比（乘以 100 ）。 FormatPercent(expression[,NumDigitsAfterD
VBS教程：函数-FormatNumber 函数
FormatNumber 函数返回表达式，此表达式已被格式化为数值。 FormatNumber( expression [,NumDigitsAfterDecimal [,Inc

首页

博学

6Ren·AI

商城

javascript - HTML Javascript 类 - 函数未启动