首页 > 解决方案 > how to show text to another div id in another page in javascript?

问题描述

I have a form where I have submitted the text from the user input but I dont know how to show the text to a different div in a another page in javascript. can anyone help me solve this issue? thanks for the help.

here is my script:

     <input onclick="addTheEvent(); return false;" type="submit" value="Add to list" class="btn btn-primary" />

 <script>

    var addToTheContent = document.getElementById("canvas");
    var scheduleEvent = document.getElementById("scheduleStartTime");
    var candidateId = document.getElementById('candId');
    var getCandId = document.getElementById("candId");

  var displayCandId = getCandId.options[getCandId.selectedIndex].value;

  function addTheEvent() {


            addToTheContent.innerHTML = "name  = " +
            displayCandId + " at " + scheduleEvent.value;
       }

   </script> 

Another page: (I want to add the value to show in my content div that is in another page)

 <pre id="content" style="white-space: pre-wrap;"></pre>

标签: javascript

解决方案


  1. 您可以使用单页应用程序 (SPA)。

单页应用程序是在浏览器中运行并且在使用过程中不需要重新加载页面的应用程序。

但是SPA是一个相当庞大的主题。它是使用浏览器历史ajax等知识所必需的。所以你应该尝试使用变体 #2

  1. 您可以使用浏览器的本地localStorage来保存数据

    localStorage.setItem("key","value") //set value into local storage
    localStorage.getItem("key") // get value
    

    “key”是任意字符串

在另一个页面上使用

document.addEventListener("DOMContentLoaded", function(event) {  
    const dataFromLocalStorage = localStorage.getItem('key');
    document.querySelector("#content").innerHTML = dataFromLocalStorage; })

推荐阅读