How to load the contents of a static HTML file into a DIV using jQuery?

I have a bunch of static HTML files containing text data:

/a.html
/b.html
/c.html

and the select / drop down box ( #loadExternal) on my main page.

Using jQuery, how can I use an event onChangeto select / drop down menu to call the appropriate external page to load into my containerDIV?

<html>

<select id="loadExternal">
    <option id="a" value="a" selected="selected">Load a.html</option>
    <option id="b" value="b">Load b.html</option>
    <option id="c" value="c">Load c.html</option>
</select>

<div id="container">
</div>

</html>
+3
source share
2 answers
$("#loadExternal").change( function () {
   page = $(this).val();
   $("#container").load(page + ".html")
});
+5
source

You can associate a change event with a selection field. Get the value of the current selection. Use to download the page . .load()

$("#loadExternal").change(function(){
    var pageToLoad = this.value + ".html";
    $("#container").load(pageToLoad);
});

See working demo

+1
source

Source: https://habr.com/ru/post/1781774/


All Articles