如何在JavaScript中使用存儲在我的服務器中的對象？

我想在javascript中聲明存儲在file.txt中的兩個對象，並在代碼中使用它。如何在JavaScript中使用存儲在我的服務器中的對象？

比如我在index.php寫了這個：

var counter = Number(localStorage.getItem('rans')) || 0; 
var counter1 = Number(localStorage.getItem('bans')) || 0; 

$('.redanswer').one('click', function(){ 
    localStorage.setItem('rans', ++counter); 
    $('.rtotal').text(counter + " concordano"); 
    $('.btotal').text(counter1+ " non concordano"); 
    $('.rgraphic').css("height", counter * 100/(counter1+counter)); 
    $('.bgraphic').css("height", counter1 * 100/(counter1+counter)); 
}); 

$('.blueanswer').one('click', function(){ 
     localStorage.setItem('bans', ++counter1); 
     $('.btotal').text(counter1 + " concordano"); 
     $('.rtotal').text(counter + " non concordano"); 
     $('.rgraphic').css("height", counter * 100/(counter1+counter)); 
     $('.bgraphic').css("height", counter1 * 100/(counter1+counter)); 
});

正如你所看到的，在這個例子中，項目bans和rans存儲在localStorage和我用計數器的項目。我想寫完全相同的代碼，但存儲在我的file.txt中的新bans和rans。我認爲這必須用AJAX來完成，但我不知道。

我覺得file.txt的有這樣必須寫道：

bans: 1; //casual number 
rans: 5; //casual number

我希望你明白，非常感謝你。

來源

2016-02-05 Niccolò Guidi

它可以用AJAX完成，我認爲這意味着你需要讀一本書或找到一些教程 – RiggsFolly

我不能創建在YouTube上沒有任何東西，我不明白如何在我的代碼中插入我需要的代碼。 –

YouTube並不是唯一的資源，但是如果你嘗試它，GOOGLE幾乎可以找到任何東西 – RiggsFolly

你是對的，你需要使用AJAX來獲取數據。

$.ajax({ 
    type: 'GET', 
    url: 'file.txt', 
    dataType: 'json', 
    success: function(data) { 
    if (data.result === 'error') { 
     //show an error message 
    return false; 
    } else { 
    console.log(data); 
    bans = data.bans; 
    rans = data.rans; 
    } 
    } 
});

這是我使用的典型AJAX代碼。如果您可以將任何數據作爲PHP中的數組存儲在file.txt中，那麼使用它可能會更容易。因此，例如您的file.php你是從AJAX調用到可能是這樣的：

<?php 
$bans = array(); //your bans data here 
$rans = array(); //your rans data here 

try { 
    echo json_encode(array('result' => 'success', data => array('bans' => $bans, 'rans' => $rans))); 
} catch (Exception $e) { 
    echo json_encode(array('result' => 'error', 'message' => $e->getMessage())); 
    exit(); 
}

這可能不是最適合你的設置，但我希望的信息幫助你。

來源

2016-02-05 15:53:49 Shaazaam

我必須在我的jQuery代碼中更改什麼？ –

當async = false時它仍然被認爲是Ajax嗎？ – Roberto

@羅伯託：好問題。這段代碼來自我坐下的一段較老的代碼。將異步設置爲false是不推薦使用的方法。 @NiccolòGuidi：將$ .ajax部分置於'$（'。blueanswer，.redanswer'）之下。（'click，function（）{// ajax here}）' – Shaazaam

它可以使用Ajax來完成，但也可以不

的index.php

<?php 
    // read your file.txt 
    // strip off the comments 
    // get the value part of bans: 1 into a variable $bans 
    // get the value part of rans: 5 into a variable $rans 

// for testing 
$bans = 1; 
$rans = 5; 

echo '<script>'; 
echo "var master_bans = $bans;"; 
echo "var master_rans = $rans;"; 
?> 

var counter = Number(localStorage.getItem('rans')) || master_bans ; 
var counter1 = Number(localStorage.getItem('bans')) || master_rans; 

$('.redanswer').one('click', function(){ 
    localStorage.setItem('rans', ++counter); 
    $('.rtotal').text(counter + " concordano"); 
    $('.btotal').text(counter1+ " non concordano"); 
    $('.rgraphic').css("height", counter * 100/(counter1+counter)); 
    $('.bgraphic').css("height", counter1 * 100/(counter1+counter)); 
}); 

$('.blueanswer').one('click', function(){ 
     localStorage.setItem('bans', ++counter1); 
     $('.btotal').text(counter1 + " concordano"); 
     $('.rtotal').text(counter + " non concordano"); 
     $('.rgraphic').css("height", counter * 100/(counter1+counter)); 
     $('.bgraphic').css("height", counter1 * 100/(counter1+counter)); 
}); 
</script>

來源

2016-02-05 15:54:17 RiggsFolly

我讚賞你的回答，但我不想要「LocalStorage」... –

@NiccolòGuidi - 這是一個很好的答案。如果你不需要localStorage調用，它將繼續工作，例如，var counter = master_bans; – Roberto

RiggsFolly的解決方案，它確實在服務器端完成的工作，似乎是最好的辦法。（已投票）

但是，另一種方法是使用腳本標記簡單加載文件，如下所示。

file.txt的的含量爲：

var config={"rans":10,"bans":20};

頁：

<html> 
<head> 
    <script type="text/javascript" src="file.txt"></script> 
</head> 
<body> 
<script type="text/javascript"> 

    var counter = config.rans; 
    var counter1 = config.bans; 
    alert('counter: ' + counter + ', counter1: ' + counter1); 

    // the rest of your code here 

</script> 
</body> 
</html>

在file.txt的值可以使用編輯器，PHP功能，或一些javascript，像這樣進行修飾：

// write file.txt 
    var xhr = new XMLHttpRequest(); 
    xhr.open('PUT','file.txt', true); 
    xhr.setRequestHeader('Content-Type','text/javascript; charset=utf-8'); 
    xhr.send('var config={"rans":' + counter + ',"bans":' + counter1 + '};');

來源

2016-02-05 16:32:42 Roberto

如何永久編輯file.txt？我想用''var config = {「rans」：'+ ++ counter +'，「bans」：'+ ++ counter1 +'}替換file.txt中的文本;'' –

@NiccolòGuidi - From你的例子，它似乎你想增加和存儲新值到文件。正確？那麼，什麼事件和條件會導致更新？如果您可以提供更多信息，那麼我會提供一個建議和示例。 – Roberto

如何在JavaScript中使用存儲在我的服務器中的對象？

回答

相關問題