Referencing a javascript file in another

Question

Referencing a javascript file in another

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I have an html file that contains a button, which when pressed calls a function "newBiblioteca ()" which is responsible for creating a library-type object. The problem is that when you click on the button the browser does not do anything. And seeing the console tells me that:

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

I imagine that it is because the file js that houses the Library is not referenced from the class functions that I have that is the one that calls the button when it is pressed.

The outline of the page would be the following: html-> button that calls newBiblioteca - > DOUBT- > library class in file js

In doubt I mean that, how can I reference the class that hosts the library object, inside the file functions that the function of creating objects of library type keeps?

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

/* CONTENEDORES */
#f1{
    background-color: aqua;
    height: 65%;
    text-align : center;
}
#f2{
    background-color: bisque;
    height: 35%;
    text-align : center;
}

/* Columnas del div superior */
#f1c1{
    width: 33%;
    float: left;
}

#f1c2{
    width: 33%;
    margin:0 auto !important; 
    display:inline-block
}

#f1c3{
    width: 33%;
    float: right;
}

/* Columnas del div inferior */
#f2c1{
    width: 33%;
    float: left;
}

#f2c2{
    width: 33%;
    margin:0 auto !important; 
    display:inline-block
}

#f2c3{
    width: 33%;
    float: right;
}

  <div id="f1">
            <div id="f1c1">
                <h5>BIBLIOTECA</h5>
            </div>
            <div id="f1c2">
                <h5>SOCIOS</h5>
            </div>
            <div id="f1c3">
                <h5>LIBRO</h5>
            </div>
        </div>

        <div id="f2">
            <div id="f2c1">
                <button onclick="newBiblioteca()">Nueva Biblioteca</button>
            </div>
            <div id="f2c2">
            </div>
            <div id="f2c3">
            </div>
        </div>

By doing var biblio = new Library (); I can not create it correctly since it is trying to look for it within the same file when it is in another one that would be the following:

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;
}

javascript html objeto

asked by Eduardo 04.11.2017 в 15:06

source

2 answers

0

It is not about referencing one js inside another js. If not put all references within the html. at that moment the browser will "swallow" everything. The solution would be like this:

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

Put that line within the goal of the page

answered by 04.11.2017 в 15:29

Problem: "Function in ngFor runs multiple times without stopping" I can not find the android folder emulated / 0 /

score 1 · Accepted Answer

Put your javascript files within the head of your page or at the end of the body of your page, like this:

Within head :

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

Or at the end of body :

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

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

I hope and serve you, greetings.