我在另一个内部有一个函数,我想从html文件中调用内部函数。

    <head>

<meta charset="utf-8">
<title></title>

<link rel="stylesheet" href="style.css">
<script type="text/javascript" src="script.js"></script>
</head>

<body>
<input id="start" value="start" type="button" onclick="start()">
</body>

和JS。

function first()
{
    alert("First")

    function start()
    {
        alert("start");
    }
}

为什么在这种情况下按钮不起作用? 谢谢

===============>>#1 票数:1

这是因为你的start函数被封装在第first函数范围内。

一种方法是通过赋值您的start 暴露给全局window对象:

function first() {
    alert("First");
    window.start = function() { // encapsulated but available to the global window object
        alert("start");
    };
}

first(); // Still needed in order to execute it and expose `start`

start变量暴露在函数作用域之外的类似方法:

var start = null; // (Says hello to window)

function first() {
    alert("First");
    start = function() {
        alert("start");
    };
}

// Here `start` is still null
first(); // Now `start` is a function

===============>>#2 票数:1 已采纳

你必须读取Javascript函数/变量作用域 您的start函数在first函数中定义,因此它被视为该函数的本地函数。 为了使其在脚本中的任何位置可用/可调用,它必须属于全局或窗口对象的浏览器。 有几种方法可以实现这一目标。

1)在第一个函数之外定义start变量作为窗口对象的属性。 然后,在第一个函数内部,为它分配一个函数引用。

var start = null; //defined variable outside of any function, and so has global scope

function first()
{
   alert("First")

   //assign a function to global variable `start`
   start = function()
   {
      alert("start");
   }
}

first(); //when you invoke first, it creates the inner function and assigns its reference to the global `start` variable, which can then be invoked
start();

2)使用闭包,从外部函数返回一个命名函数:

function first()
{
   alert("First");

   var start = function()
   {
      alert("start");
   }

   return start;
}

3)上面略有变化,从外部函数返回一个匿名函数:

function first()
{
   alert("First");

   return function()
   {
      alert("start");
   }
}

在上面的(2)和(3)中,当您第一次调用该函数时,它将发出警报First ,然后它将返回一个您可以立即执行的函数或者为变量执行分配一个变量。 例如:

first()(); //alerts `First`, which returns a function reference, which reference is executed right away, to the alert `start`

//alerts `First`, then assigns returned function to the variable `start`
var start = first(); //`start` now holds a function reference which you can execute anytime, like so:

start(); //alerts `start`

最后,作为一个快速提醒,强烈建议您使用事件侦听器将事件分配给元素,而不是直接在元素中使用onclickonwhatever属性。 这也符合关注点分离原则

接下来,更新的代码应如下所示:

HTML

<input id="start" value="start" type="button"><!-- notice no `onclick` attribute attached to it -->

使用Javascript将click事件监听器附加到按钮:

var startBtn = document.getElementById("start");
if (typeof startBtn.addEventListener === "function")
{
    startBtn.addEventListener("click", function(){first()()}, false);
}
else if (typeof startBtn.attachEvent === "function")
{  
    startBtn.attachEvent("onclick", function(){first()()}); 
}
else 
{
    startBtn.onclick = function(){first()()}
}

===============>>#3 票数:1

function关键字使名称在其定义的函数中是本地的。从HTML属性调用的函数必须是全局的。

然后你必须先调用first()才能调用start()

 var start; function first() { alert("First"); start = function() { alert("Start"); }; } first(); 
 <input id="start" value="start" type="button" onclick="start()"> 

===============>>#4 票数:0

为什么不启动一个全局函数来从任何地方调用它,即使是从你的第一个函数:

var start = function(){
        alert("start");
    },
    first = function(){
        alert("first");
        start();
    };

  ask by Klick translate from so

未解决问题?本站智能推荐:

2回复

从外部javascript调用html文档中的函数?

如何从外部javascript文件中调用html文档中的函数?
6回复

HTML中的Javascript函数未调用

我有一个html页面,其中的javascript下面写在了头部, 然后该表单如下所示: 当我提交表单时,即使输入的内容不是数字,也没有警告消息,我是否知道我的代码有什么问题?
3回复

在HTML中调用JavaScript函数

我正在使用javascript和html。 我有一个称为登录的javascript函数,我想用HTML调用此函数。 我看到了一些直接在HTML中包含javascript函数的代码。 我不想这样做,因为代码很长。 这是HTML: Javascript函数是: 我包括一个wi
2回复

从HTML在JavaScript中调用函数

我正在尝试从HTML文件中的JavaScript调用方法。 具体来说,从Dog and Cat(在HTML下方显示)中调用方法“ speak”。 我想我应该在onload上使用window.onload = function()或类似的东西,但是我不知道如何调用方法。 这是HTML内容
1回复

在HTML中调用JavaScript函数

我是Java语言的新手,非常感谢您的帮助。 我正在使用JavaScript,Html,Css对Hangman进行编码。 我能够生成随机单词,也可以根据长度创建占位符。 但是,当我单击字母时,我想运行该功能,该功能将检查单词是否包含字母,如果是,它将把该字母放置在相应的占位符中。 这就是我
1回复

在HTML中调用JavaScript函数

我具有以下功能,该功能是Google Earth API的一部分。 它会在地图上生成图像叠加层,因此必须多次调用。 如何调用此函数并为每个调用赋予唯一的ID? 我想到了这样的事情: 在HTML中有此内容: <p id="campusbutton"><p>
2回复

在html javascript函数中调用svg javascript函数

我有一个SVG文档,其中绘制了三个圆圈: 出于测试目的,我有onclick=""方法,但实际上这个文档是我的html文档中的一个对象: 我有一个数据集,这三个圆圈显示每个项目的“进度”。 我通过从服务器中提取新列表来定期更新JSON集。 对于每个更改的项目,我想更新已填充的圆
3回复

javascript函数中的HTML

我有一个javascript popUp函数... 将两个参数插入弹出窗口,然后插入到文档的html中。 我有一个<form>作为body的想法,但它疯了吗? 我尝试了各种各样的东西,它似乎是导致问题的html作为参数。 我有限的javascript / jQuer
3回复

从html文档中调用函数不会生成警报

大家好,谢谢您的光临。 单击更新按钮时,我试图调用javascript函数。 这是javascript 和html 如果您想查看所有代码,请查看此jsfiddle http://jsfiddle.net/runningman24/wAPNU/24/ 我试图使该函
1回复

HTML主体中没有函数调用的Javascript函数调用?

我遇到了一个有关合并HTML和Javascript的小问题。 我想用参数调用JS函数,而无需任何按钮单击或触发(如onchange或input)(如果有的话)。 现在,我在按钮标签中使用“ onclick”。 我阅读了引人入胜的Wikipedia文章,其中介绍了Java语言 ,它的用法