我有一个练习,我必须在其中显示一个类的模型、板和所有者属性。我已经在 onclick 中添加了要显示的功能,但它无需单击即可执行。我还尝试从 onclick 中删除“everyone”参数并将其放入 show 函数中,但这甚至没有发送数据。那么,我理解,要在事件中呈现函数,不应显示参数。但是,我怎样才能呈现这样的功能呢?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<form action="">
<input type="text" id="marca" placeholder="marca">
<input type="text" id="modelo" placeholder="modelo">
<input type="text" id="placa" placeholder="placa">
<input type="text" id="color" placeholder="color">
<input type="text" id="duenho" placeholder="duenho">
<button type="button" id="boton">enviar</button>
<button type="button" id="ver">todos</button>
</form>
<script>
class Automovil{
constructor(marca, modelo, placa, color, duenho){
this.marca = marca;
this.modelo = modelo;
this.placa = placa;
this.color = color;
this.duenho = duenho;
}
todos = Array();
get marca(){
return this._marca;
}
set marca(x){
this._marca = x;
}
get modelo(){
return this._modelo;
}
set modelo(x){
this._modelo = x;
}
get placa(){
return this._placa;
}
set placa(x){
this._placa = x}
get color(){
return this._color;
}
set color(x){
this._color = x;
}
get duenho(){
return this._duenho;
}
set duenho(x){
this._duenho = x;
}
}
function crear(){
var brand = document.getElementById("marca").value;
var model = document.getElementById("modelo").value;
var numberPlate = document.getElementById("placa").value;
var colors = document.getElementById("color").value;
var owner = document.getElementById("duenho").value;
nuevo = new Automovil(brand, model, numberPlate, colors, owner);
todos.push(nuevo);
}
function mostrar(x){
var indice = x.length -1;
for($i = 0; $i <= indice; $i++){
var uno = todos[$i]._modelo + " " + todos[$i]._placa + " " + todos[$i]._duenho + ('\n');
document.write(uno + "<br>");
}
}
var ford = new Automovil("ford", "fiesta", "1234hh", "azul", "Paco");
var opel = new Automovil("opel", "corsa", "6543as", "rojo", "Pepe");
todos = [ford, opel];
boton.onclick = crear;
ver.onclick = mostrar(todos);
</script>
</body>
</html>
一如既往,非常感谢
我添加了以下代码块,您需要这些代码块才能执行
onclick
您遇到的问题是您直接调用
boton
而没有考虑尚未定义变量,这只需使用var boton;
接下来您需要将此按钮变量分配给来自 DOM(或来自您的 HTML)的元素。为此,您使用函数
document.getElementById(<nombre_del_elemento>)
,在这里您放置您在 HTML 中定义的 ID 的值,在这种情况下,它与变量的名称一致,但它本身可以是任何名称,您正在链接您的带有 Javascript 的 HTML。建立这种关系后,您可以将事件添加到变量中。在事件的情况下,您将函数分配给将在事件触发时执行的事件。以前你有这个代码
它分配了函数执行的结果,
mostrar(todos)
并且由于它没有任何返回值,因此它按值给出,undefined
因此每次触发事件时它都会尝试执行 aundefined
,这没有意义。这就是为什么你应该用另一个函数包装这个执行,以便它在事件发生时执行 show 函数。最终更正后的代码如下所示: