Tengo un html con unos campos y un boton: al apretar el boton quiero que cree un objeto Persona y muestre con las funciones del objeto los datos introducidos.
El error es: InteractVisual.js:15 Uncaught TypeError: per.getNombre is not a function at HTMLButtonElement.GetData (InteractVisual.js:15) GetData @ InteractVisual.js:15
Codigo de Index.html:
<!DOCTYPE html>
<html lang="es">
<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>
<script type="text/javascript" src="js/Persona.js"></script>
<script type="text/javascript" src="js/InteractVisual.js"></script>
</head>
<body>
<p>Nombre: </p>
<input type="text" name="name" id="Nombre">
<p>Apellido: </p>
<input type="text" name="secondName" id="Apellido">
<p>CI: </p>
<input type="text" name="ci" id="CI">
<br>
<br>
<button type="submit" id="btnSubir">Enviar</button>
</body>
</html>
Codigo De InteractVisual.js:
var TxtNombre, TxtApellido, TxtCi, btnSubir;
window.onload = init;
function init() {
TxtNombre = document.getElementById('Nombre');
TxtApellido = document.getElementById('Apellido');
TxtCi = document.getElementById('CI');
btnSubir = document.getElementById('btnSubir');
btnSubir.addEventListener('click', GetData, false);
}
function GetData() {
var per = new Persona(TxtNombre.value, TxtApellido.value, TxtCi.value);
alert(per.getNombre());
alert(per.getApellido());
alert(per.getCI());
}
Codigo de Persona.js:
var Nombre, Apellido, CI;
class Persona {
constructor(nombre, apellido, ci) {
this.Nombre = nombre;
this.Apellido = apellido;
this.CI = ci;
}
//Funciones Getter y Setter
get getNombre() {
return this.Nombre;
}
set setNombre(nombre) {
this.Nombre = nombre;
}
get getApellido() {
return this.Apellido;
}
set setApellido(apellido) {
this.Apellido = apellido;
}
get getCI() {
return this.CI;
}
set setCI(ci) {
this.CI = ci;
}
}
Desde ya muchas gracias :)