Question

Hi All I managed to sent value to other document by using INPUT in different situation but have no idea what im dong wrong to do the same with span or div.

Doesnt work soo Maybe this will be something easier to help me with.

My original idea is to increase the value of 0.00 everyttime I click the button by 0.01.. and I want this value to be showed in document one.html and two.html as well..

ORIGINAL IDEA:

                <div class="control-group">
                <label id="firstDiv" class="control-label"><span>0.00</span>
              </label>



                                    <div id="hm">
                                    <span id="textChanger" class="btn btn-
             large btn-primary pull-right"> Quick Click </span>
                                    </div>
                                      <script>

        var one = 0.00;
        document.getElementById("textChanger").onclick = function(){

            if (one < 0.05){


            document.getElementById("firstDiv").innerHTML = one +=0.01;

            }

            else {
                document.getElementById("firstDiv").innerHTML = "You are a 
             WINNER!";
                document.getElementById("hm").innerHTML = "";

            }
        }
            </script>

Simple idea for me to understand all the local storage. Its not working. one.html

 <html>
  <head>
    <title></title>
    <script>


        function storedata()
        {
            localStorage.username = document.getElementById('txt_username');
        }



    </script>


  </head>
  <body>


    <span id="txt_username">Arek</span>
    <input type="button" onclick="storedata()" name="name" value="Store 
    UserName"/>


   </body>
  </html>

two.html

  <html>
  <head><script>
   function getlocalstorage()
        {
            if(localStorage.username)
            {
                document.getElementById('span1').innerHTML = 
  localStorage.username;
            }
        }

        </script>
</head>
<body onload="getlocalstorage()">



    <span id="span1"></span>

</body>
</html>

Answer 1

Open the second document via var w2 = window.open("document2.html");. Then w2 is the window object of document 2.

window.open

Answer 2

Use localStorage. In the first page, set a localStorage item with localStorage.setItem(item, value). In the second page check to see if the localStorage item exists and if it does, use the value in it, otherwise use 0.0.

You might also want to delete the localStorage item when the first page closes. For that, you should use the onbeforeunload event.

In the first page, the JS would be like this:

var n=0.0;
function sd(){
n+=0.1;
localStorage.setItem("ls", n);
}

The function sd has to be called using the onclick event.

The second page's JS:

function get(){
if(localStorage.getItem("ls")){
document.getElementById("id").innerHTML=localStorage.getItem("ls");
};
}
document.addEventListener("DomContentLoaded", function(){
get();
})

How to change text in div from another document?

2 个答案: