javascript - Javascript load html

Question

I just got a problem, i have a select tag with some different options.

Now I want to check which of these options is selected by the user.

Then i want to load a new html file into this site (depends on which options the user has checked) width javascript, how do i do that ?

Here is the select menu

<select>
   <option>option1</option>
   <option>option2</option>
   <option>option3</option>
   <option>option4</option>
   <option>option5</option>
   <option>option6</option>
</select>

Answer 1

考虑html代码：

<select onchange="changeIt();" id="formula">
        <option>option1</option>
        <option>option2</option>
        <option>option3</option>
        <option>option4</option>
        <option>option5</option>
        <option>option6</option>

    </select>

然后以下 javascript 代码将加载新的本地 html 页面：

function changeIt()
{
    var fName = document.getElementById("formula");
    var fText = fName.options[fName.selectedIndex].text;
    if(fText=="option1")
    {
        window.location.href = "abc.html";
    }
    else if(fText == "option2")
    {
        window.location.href = "xyz.html";      
    }
}

abc.html 和 xyz.html 都是本地 html 文件。

Answer 2

jquery就是这么简单添加这段代码

  $(function(){
    var includes = $('[data-include]');
    jQuery.each(includes, function(){
      var file = 'views/' + $(this).data('include') + '.html';
      $(this).load(file);
    });
  });
</script>

Use jquery