There is a div and a button, by pressing it is necessary to load the html page into this block:

html:

<div> <div id = "showDiv" width = "100px" height = "400px" > Отображение страницы </div> <button id = "buttonWinter">Зима</button> <button id = "buttonSpring">Весна</button> <button id = "buttonSummer">Лето</button> <button id = "buttonAutumn">Осень</button> </div>

Js:

  var buttonWinter = document.getElementById('buttonWinter'); buttonWinter.addEventListener('click',ShowWinter); function ShowWinter(event){ event.preventDefault(); $('#showDiv').on('../html/winter.html'); }

Why not?

  • the load method is for the jquery version below 3 - bsuart

2 answers 2

The $ (). On () method takes at least two arguments (from the jquery documentation): events and handler .
And as far as I know, this method cannot be loaded into html.

Use the method $ (). Load ('path_to');

 var buttonWinter = document.getElementById('buttonWinter'); buttonWinter.addEventListener('click',ShowWinter); function ShowWinter(event){ event.preventDefault(); $('#showDiv').load('../html/winter.html'); }

Or use ajax .

  • the load method is for the jquery version below 3, and I have 3.1 - bsuart
  • @ bsuart2017 does it work fine in the 3+ version, or do you have any special reasons not to use it? - Ep1demic
  • unfortunately, faced with the fact that it does not quite work perfectly in 3+ - bsuart
  • @ bsuart2017, this is very strange, maybe there was something wrong with your code? - Ep1demic

Maybe when js works for you, the markup is not plunged yet, wrap the code in:

 $( document ).ready(function() { //Оберни код });

either show fully if it is not all