Call a javascript function from another page

Question

Call a javascript function from another page

Navigation

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

-2

How can I call a javascript function from another page?

Example:

Page5.html

<a href="javascript:irAFuncionDePagina2Html();">Contacto</a>

I add more explanation, I thought it would be better understood with the previous example.

I have on a page a long scroll with a form in a section in a certain "Y" position.

In other pages I have a contact link that when clicked goes to the form on this page pagina2.html with a link of the type

<a href="pagina2#contacto">Contacto</a>

The problem is that for several functions that the page has I have to run it with a JavaScript function where before I scroll the page to position 0,0 in this way,

<a href="JavaScript:scrollHaciaContacto()">Contacto</a>

Where the scrollHaciaContacto function is declared on page2.html

function scrollHaciaContacto() {
   window.scrollTo(0,0);
   location.href = "pagina2#contacto";
}

That is, before going to the "Y" position of the page I have to scroll to position 0,0.

javascript html5 css3

asked by Popularfan 17.12.2018 в 17:27

source

3 answers

1

Is the JS function you want to call, is it in a class of type JS or do you have it in tags in the other HTML from which you want to call it?

If it is the first option, I consider that you should first check that it complies with the own requirements of your function, and then call that function with a return funcion() , or in the other case, if your script is inside the HTML itself , the most advisable thing is that you pass it to a JS class, both for the security of your page and for the semantics of the network.

answered by 17.12.2018 в 17:41

0

What you have to do is put the functions of the pages in ".js" files, example functionspagina2.js, and send this file with the javascript functions from the page in which you occupy it, which in this case is page5.html.

Example of how to send a file called ".js" from html:

<!DOCTYPE html><html><body><script src="funcionespagina2.js"></script></body></html>

answered by 17.12.2018 в 17:34

Program in c ++ that executes A command [closed] Convey a string to a date

score 1 · Accepted Answer

In pagina5.html links to the page you want to go to and pass a parameter with the ID of the element you want to scroll to. The parameter can be passed in different ways, to be read from the search string (like the GET) or as a hash, the only thing would be that you do not pass it as is (otherwise the browser will directly go to that section that it seems that is what you do not want):

<a href="pagina2.html?objetivo=contacto">Contacto</a>

<a href="pagina2.html#objetivo=contacto">Contacto</a>

Now from your script on page2.html, when the page loads, check if that parameter exists or not. And if it exists, it is when you call the function that makes the scroll as you want instead of directly.

For example, if you passed the parameter through the hash you can read it using window.location.hash (if you pass it as a parameter of the URL you can read it with window.location.search ). And from there you execute the action you want to do.

Here you can see a generic version:

// cambia la función para que reciba el ID del elemento al que quieres hacer scroll
function scrollHaciaContacto(id) {
   window.scrollTo(0,0);
   location.href = "pagina2.html#" + id;
}

// cuando se cargue la página
window.addEventListener("load", function(event) {
  // obtén el ID del document al que quieres hacer scroll
  const hash = window.location.hash.replace("#objetivo=", "");
  // llama a la función para que vaya al elemento indicado
  scrollHaciaContacto(hash)
});