JavaScript函数名称alt()

Question

JavaScript函数名称alt()

4

如果函数名为“alt”，我会收到错误消息：“alt不是一个函数”。所有其他名称都有效。以下是代码：

<!DOCTYPE HTML>
<html>
    <head>
    </head>
    <body>
        <input type="button" value="click me" onclick="alt('dato',28);"/>
        <script type="text/javascript">
            window.onload = function(){
                alt = function(name,age){
                    alert(name + "  " + age);
                }
            }
        </script>
    </body>
</html>

请将函数名称从“alt”更改为任何其他允许的名称，以查看其是否正常工作。

有人能解释一下正在发生什么吗？

- ზურა კუპატაძე

3个回答

3

问题在于，由于您使用了事件处理程序内容属性，您的全局函数window.alt被HTMLInputElement.prototype.alt所遮盖。

这种行为在步骤10中解释了获取事件处理程序当前值。

词法环境作用域

如果H是一个元素的event handler，那么让Scope成为NewObjectEnvironment(document, 全局环境)的结果。

否则，H是一个Window对象的event handler：让Scope成为全局环境。

如果form owner不为空，则让Scope成为NewObjectEnvironment(form owner, Scope)的结果。

如果element不为空，则让Scope成为NewObjectEnvironment(element, Scope)的结果。

注意：NewObjectEnvironment()在ECMAScript第5版中定义，在10.2.2.3 NewObjectEnvironment (O, E)章节中描述。

这意味着目标元素的作用域遮蔽了全局作用域。因此，您可以...

Rename your function

function alt__(name,age){
  alert(name + "  " + age);
}

<input type="button" value="click me" onclick="alt__('dato',28)" />

Use window.alt (assuming window has not been shadowed):

<input type="button" value="click me" onclick="window.alt('dato',28)" />

function alt(name,age){
  alert(name + "  " + age);
}

<input type="button" value="click me" onclick="window.alt('dato',28)" />

Use an event handler IDL attribute instead of a content attribute one:

theInput.onclick = function(){ alt('dato',28); });

function alt(name,age){
  alert(name + "  " + age);
}
document.querySelector('input').onclick = function(){
  alt('dato',28);
};

<input type="button" value="click me" />

Use an event listener instead of an event handler:

theInput.addEventListener('click', function(){ alt('dato',28); });

function alt(name,age){
  alert(name + "  " + age);
}
document.querySelector('input')


----------

.addEventListener('click', function(){
  alt('dato',28);
});

<input type="button" value="click me" />

- Oriol

0

你不能在属性值中将HTML属性名称用作函数，因为它会引用属性值。

例如：

<input type="button" value="click me" onclick="console.log(value)" />

将会在控制台记录 "click me"

http://jsfiddle.net/z45dbxL4/

this是隐含的。因此，它与以下代码相同：

<input type="button" value="click me" onclick="console.log(this.value)" />

- Miguel Mota

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Maximillian Laumeister · Accepted Answer

发生这种情况的原因是，在onclick属性内部，this指的是附加有该属性的元素。现在，alt是一个标准的属性名称，对于您的按钮来说，它将从未设置过，因为您没有在HTML中指定alt属性（并且不需要为input添加alt属性，因此无需添加）。

简而言之，alt不是指您在脚本中设置的全局变量window.alt，而是指元素的alt属性，该属性起始值为未设置。

因此，当您运行onclick="alt('dato',28);"时，它会被隐式解释为：onclick="this.alt('dato',28);"。

要获取您在全局范围内设置的alt，而不是每个HTML元素都具有的alt，您需要显式地进入全局作用域，如下所示：

onclick="window.alt('dato',28);"