페이지를 새로 고침하는 동안 자바 스크립트 배열을 유지하는 방법은 무엇입니까?

Question

PHP 파일

<input type="text" id="txtMyText"> 
<button type="button" id="myButton" onclick="addItemToArray()">Add to Array</button> 

자바 스크립트 내가 텍스트 필드에 어떤 값을 입력하고 버튼을 누르 때마다

var myArray = [] 

function addItemToArray() 
{ 
    myArray.push(document.getElementById("txtMyText").value); 
} 

파일은, 값이 배열에 저장됩니다. 페이지가 새로 고쳐지면 배열이 비게됩니다. 수동으로 제거하기 전까지는 요소를 유지하려고합니다. 어떻게 보관합니까? PHP 세션이나 숨겨진 필드에 배열을 넣어야합니까? 그렇다면 어떻게?

var items = JSON.parse(sessionStorage.getItem("items")); 

Answer 1

사용 localStorage API를 사용 setItem() 방법은 localStorage에 저장이되기 전에 배열을 stringfy 않습니다. 사용 getItem() 저장 항목을 thosed과 쿠키에

if(localStorage.getItem('textValues') == null){ 
    var myArray =[]; 
}else{ 
    myArray = JSON.parse(localStorage.getItem('textValues')); 
    //-----------^parse the item by getting---^--stored item 
} 

function addItemToArray(){ 
    myArray.push(document.getElementById("txtMyText").value); 
    localStorage.setItem('textValues', JSON.stringify(myArray)); 
    //------------^store the item by stringify--^ 
} 

DEMO

Answer 2

로컬 저장소에 저장해야합니다. localStorage.setItem("storageName", myArray)는이 localStorage.getItem("storageName") 또는 아마

Answer 3

은 당신이가는 새로 고침을 유지하려면 :

sessionStorage.setItem("items", JSON.stringify(items)); 

가 스토리지에서 배열을 가져 오기 : https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage

스토어 배열 : 당신은 브라우저의 내장 스토리지를 사용할 수

Answer 4

var myArray = localStorage.getItem("storageName") 가장 쉬운 방법은 jQuery를 쿠키를 사용하는 것입니다 검색 할

당신이 PHP 세션을 사용하려면, 내가 활용할 것

if ($.cookie('arrayItems')){ 
     myArray=JSON.parse($.cookie('arrayItems')); 
} 


function addItemToArray() 
{ 
    myArray.push(document.getElementById("txtMyText").value); 
    $.cookie('arrayItems',JSON.stringify(myArray)); 
} 

Answer 5

편집 var myArray = []/편집 AJAX. 배열을 만들 때 배열을 처리 할 파일을 만들어야합니다. 다음은 간단한 예입니다.

첫 페이지

<?php 
    //start the PHP session to save your array in 
    session_start(); 
?> 

<script type="text/javascript"> 
var myArray = []; 
<?php 
    if(isset($_SESSION['myArray'])) { 
     foreach($_SESSION['myArray'] as $item){ 
      // prepopulate the session array from PHP 
      echo "myArray[] = ".$item.";"; 
     } 
    } 
?> 
function addItemToArray(){ 
    var addvalue = document.getElementById("txtMyText").value; 
    myArray.push(addvalue); 
    if (window.XMLHttpRequest){ var xmlhttp=new XMLHttpRequest(); }else { var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } 
    xmlhttp.onreadystatechange=function() { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) { 
      document.getElementById("myDiv").innerHTML += xmlhttp.responseText .", "; 
     } 
    } 
    xmlhttp.open("GET","save_array.php?newValue="+,true); 
    xmlhttp.send(); 
} 
</script> 

<div id="show_my_array"> 
    <?php 
     //show array saved from last time 
     if(isset($_SESSION['myArray'])) { 
      foreach($_SESSION['myArray'] as $item){ 
       // prepopulate the session array from PHP 
       echo $item.", "; 
      } 
     } 
    ?> 
</div> 
<input type="text" id="txtMyText"> 
<button type="button" id="myButton" onclick="addItemToArray()">Add to Array</button> 

save_array.php이 목적을 위해

<?php 
session_start(); 
if(!isset($_SESSION['myArray'])){ 
    $_SESSION['myArray'] = array(); 
} 
$_SESSION['myarray'][] = $_GET['newValue']; 
echo $_GET['newValue']; 
?>