输入元素有onload事件吗？

Question

当一个输入元素或其他HTML元素被渲染时，是否有可能触发JavaScript脚本？该脚本应该从HTML标签内部触发，以便我们可以将“this”传递给JS函数。

- imdahmd

Answer 1

不，没有这样的事件。

然而，直接放置在HTML元素之后的

- Pekka

Answer 2

一种模拟这种事件的方法是创建一个自定义的data-*属性（符合HTML-5标准），并将其用作选择器。接着，在主要的JavaScript代码中，您可以添加一个选择器，用于选择具有特定data-XXX属性的任何东西，并在其中评估JavaScript代码。

示例HTML代码：

<div data-onload="sampleFunction('param1', 2)"></div>

示例 JavaScript 代码（使用 jQuery）。也可以使用普通 DOM 查找具有此属性的元素。

/* Find any element which has a 'data-onload' function and load that to simulate an onload. */
$('[data-onload]').each(function(){
    eval($(this).data('onload'));
});

这个很不错，我实际上在生产中使用它。

- ChrisR

---

通常认为使用 eval 是不良实践，应尽可能避免。eval 可能很不安全，因为它将运行 data-onload 属性中包含的任何代码。你可以使用通用回调函数，只需通过 data-onload 传递参数，像这样 http://codepen.io/kevingimbel/pen/0c9366e17a96288ee8a685d6d53a805f。 - Kevin G.

Answer 3

不会。然而，放置在输入元素标记之后的任何脚本都将在解析脚本之前使用输入元素，因此可以使用它。所以，如果所有这些都位于中：

<input id="a">
<script>document.getElementById('a');</script>

那将会完全有效。

- Delan Azabani

---

问题是当元素被渲染时，我不知道该ID。 - imdahmd

Gareth，注意我在示例脚本中选择了id为a的元素。Imdad，你可以使用其他选择元素的方法，比如标签选择，甚至是类选择。 - Delan Azabani

Answer 4

我有一个输入元素被动态添加到文档中，需要进行初始化。

以下是一种初始化小部件的方法，虽然不够完美，但可以在第一次使用输入时实现：

<input onfocus="initwidget(this)">

- Collin Anderson

Answer 5

有一个技巧。对于具有type="image" src="..."属性的输入，存在onload和onerror事件。您可以通过将src传递为空或始终错误并在触发onerror事件时更改类型为正确的类型来使用onerror：

function func(input) {
    console.log("Input loaded");
    input.type = "text";
    input.value = "Worked!";
    input.removeAttribute("src");
    // ...
}

<input type="image" value="" onerror="func(this)" src=""/>

- AHHP

Answer 6

不，这是不可能的。但是你可以使用jQuery + $(document).ready(function)在页面加载完成后立即修改任何输入字段。

- halfdan

Answer 7

没有，就在文档的“ready”处理程序中运行你的代码，或者使用类似jQuery的工具来让你在“ready”时运行代码（这是指DOM完成加载但图像可能尚未加载完毕的时刻）。

- Pointy