В этом HTML-файле я хочу вызвать другой HTML-файл

#javascript #python #html #css

#javascript #python #HTML #css

Вопрос:

 {%extends "layout.html"%}

{%block content%}

<form action="{{ url_for("plot")}}" method="post"> 
<label for="CompanyCode">Stock Symbol:</label> 
<input type="text" id="CompanyCode" name="ccode" placeholder="Stock Symbol">
<label for="start_date">Start Date: </label>
<input type="date" id="start_date" name="start_date">
<label for="end_date">End Date:</label>
<input type="date" id="end_date" name="end_date">

<button type="submit">Submit</button>
<button type="reset">Reset</button>

<script type="text/javascript" src="{{cdn_js | safe}}" integrity="sha384-T2yuo9Oe71Cz/I4X9Ac5 gpEa5a8PpJCDlqKYO0CfAuEszu1JrXLl8YugMqYe3sM" crossorigin="anonymous"></script>
<div class = "plot">
    <h1> This is the plot page </h1>
</div>
</script>
{{script1 | safe}}
{{div1 | safe}}

   1) <div data-include="C:/Users/saiyyam/Stocks_site/Demo/template/plotdata.html"></div>

   2) <div class="xyz">


</div>
{%endblock%}


<script type="text/javascript">
    $(function(){
        $(class="xyz").load("plotdata.html");
    });    
</script> 

Я пробовал использовать 2 метода, но ни один из них не сработал, был бы признателен, если бы вы могли мне помочь. Код над двумя методами строит некоторые графики, так что это никак не связано с импортом файлов в HTML. И да, я использовал оба метода отдельно, но они не сработали

Комментарии:

1. используйте iframe для этого в простой HTML-странице

2. хорошо, мой ответ готов

Ответ №1:

Если вы хотите просто перейти на новую HTML-страницу, затем, используя javascript, вы можете добавить атрибут onclick к своей кнопке <button onclick="window.location.href='./layout.html'" type="submit">Submit</button> , это может сработать, я не уверен, просто предлагаю другой способ 🙂

Комментарии:

1. да, но я хочу, чтобы он был встроен на ту же страницу

2. для этого не будет <iframe src=»./layout.html «></iframe> работает?

Ответ №2:

Это работает, но не с этой настройкой .. спасибо CORS>:{

Проверьте мой repl для примера, поскольку он загружает только страницы с тем же источником, что и он

 function htmlLoader(path,element){
  var xhr=new XMLHttpRequest()
  xhr.open('GET',path,true)
  xhr.send()
  xhr.onload=function(){
    element.innerHTML=xhr.response
    console.log("Page Successfully Loaded from",path)
  }
  xhr.onerror=function(err){console.error("Either due to this being a sandbox(meaning CORS blocked) or the path itself is invalid/rejects returning the call, the request has FAILED")}
} 
 <input id="addPath" />
<button onclick="htmlLoader(document.getElementById('addPath').value,document.getElementById('placeHTML'))">Add HTML from Path</button>
<div id="placeHTML"></div>