Referenciar un archivo javascript en otro

publicado por: Anonymous

Dispongo de un fichero html que contiene un boton, que al pulsarlo llama a una funcion “newBiblioteca()” que se encarga de crear un objeto de tipo Biblioteca. El problema es que al pulsar sobre el boton el navegador no hace nada. Y al ver la consola me dice que :

Uncaught ReferenceError: Biblioteca is not defined
at newBiblioteca (functions.js:6)
at HTMLButtonElement.onclick (index_biblioteca.html:22).

Me imagino que sea por que el fichero js que aloja la Biblioteca no esta referenciado desde la clase funciones que tengo que es la que llama el boton al ser pulsado.

El esquema de la pagina seria el siguiente: html->boton que llama a newBiblioteca -> DUDA-> clase biblioteca en fichero js

En duda me refiero con que, ¿Como puedo referenciar la clase que aloja el objeto biblioteca, dentro del fichero funciones que guarda la funcion de crear objetos de tipo biblioteca?

_x000D_

_x000D_

function newBiblioteca() {_x000D_
    var biblio= new Biblioteca() ;_x000D_
    biblio.id=prompt("Teclea el identificador de la biblioteca");_x000D_
    biblio.nombre=prompt("Teclea el nombre de la biblioteca");_x000D_
    biblio.localidad=prompt("Teclea la localidad de la biblioteca");_x000D_
    biblio.responsable=prompt("Teclea el nombre del responsable de la biblioteca");_x000D_
    biblio.nLibros=prompt("Teclea el número de libros de la biblioteca");_x000D_
    a[cont]=biblio;_x000D_
    cont++;_x000D_
    alert("Datos registrados con éxito");_x000D_
}

_x000D_

/* CONTENEDORES */_x000D_
#f1{_x000D_
    background-color: aqua;_x000D_
    height: 65%;_x000D_
    text-align : center;_x000D_
}_x000D_
#f2{_x000D_
    background-color: bisque;_x000D_
    height: 35%;_x000D_
    text-align : center;_x000D_
}_x000D_
_x000D_
/* Columnas del div superior */_x000D_
#f1c1{_x000D_
    width: 33%;_x000D_
    float: left;_x000D_
}_x000D_
_x000D_
#f1c2{_x000D_
    width: 33%;_x000D_
    margin:0 auto !important; _x000D_
    display:inline-block_x000D_
}_x000D_
_x000D_
#f1c3{_x000D_
    width: 33%;_x000D_
    float: right;_x000D_
}_x000D_
_x000D_
/* Columnas del div inferior */_x000D_
#f2c1{_x000D_
    width: 33%;_x000D_
    float: left;_x000D_
}_x000D_
_x000D_
#f2c2{_x000D_
    width: 33%;_x000D_
    margin:0 auto !important; _x000D_
    display:inline-block_x000D_
}_x000D_
_x000D_
#f2c3{_x000D_
    width: 33%;_x000D_
    float: right;_x000D_
}

_x000D_

  <div id="f1">_x000D_
            <div id="f1c1">_x000D_
                <h5>BIBLIOTECA</h5>_x000D_
            </div>_x000D_
            <div id="f1c2">_x000D_
                <h5>SOCIOS</h5>_x000D_
            </div>_x000D_
            <div id="f1c3">_x000D_
                <h5>LIBRO</h5>_x000D_
            </div>_x000D_
        </div>_x000D_
_x000D_
        <div id="f2">_x000D_
            <div id="f2c1">_x000D_
                <button onclick="newBiblioteca()">Nueva Biblioteca</button>_x000D_
            </div>_x000D_
            <div id="f2c2">_x000D_
            </div>_x000D_
            <div id="f2c3">_x000D_
            </div>_x000D_
        </div>

_x000D_

_x000D_

_x000D_

Al hacer var biblio = new Biblioteca(); No puedo crearlo correctamente ya que esta tratando de buscarlo dentro del mismo archivo cuando se encuentra en otro que seria el siguiente:

biblioteca.js:

var id=0, nLibros=0, cont=0;
var  nombre="", localidad="", responsable="";
var a = [];

function Biblioteca(id, nombre, localidad, responsable, nLibros){
    this.id=id;
    this.nombre=nombre;
    this.localidad=localidad;
    this.responsable=responsable;
    this.nLibros=nLibros;
}

solución

Pon tus archivos javascript dentro del head de tu página o al final del body de tu página, así:

Dentro del head:

<head>
    <script type="text/javascript" src="biblioteca.js"></script>
    <script type="text/javascript" src="function.js"></script>
</head>

O al final del body:

<body>
    <!--    ...   -->

    <script type="text/javascript" src="biblioteca.js"></script>
    <script type="text/javascript" src="function.js"></script>
</body>

Espero y te sirva, saludos.

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *