我的客户想要一个包含导入 CSV 数据而不托管在服务器上的网站。这个想法是为了让他们的销售人员可以展示他们的产品，而无需在他们的 PC 上设置 Web 访问或托管。他们还可以通过从原始 Excel 文档导出新的 CSV 文件来更新数据，而无需任何 HTML 或 Javascript 知识。
我在网上找到了很多解决方案——比如 Papa Parse (http://papaparse.com/)，但它们都要求用户使用 <input type="file" /> 选择文件.例如，使用 Papa Parse 的以下脚本运行良好:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test CSV</title>
</head>
<body>
<input type="file" />
</body>
<script src="js/jquery-1.10.1.min.js"></script>
<script src="js/jquery.parse.min.js"></script>
<script language="javascript">
$('input').change(function(e) {
$('input[type=file]').parse({
complete: function(data) {
console.log('Parse results:', data.results);
}
});
});
</script>
</html>
我的问题是我需要能够对 CSV 文件的位置进行硬编码，以便在打开网页时自动显示数据，而无需用户进行任何进一步的交互。这可能吗？还是我忽略了一些非常基本的东西？
最佳答案
对非 JavaScript 的脚本标签内的值进行硬编码 type如text/csv然后用 innerHTML 或 $("#unparsed").html() 提取它
<script type="text/csv" id="unparsed">
url,title,size
images/address-book.png?1354486198, Address Book, 1904 KB
images/front-row.png?1354486198, Front Row, 401 KB
images/google-pokemon.png?1354486198, Google Pokémon, 12875 KB
...
</script>
$(function parseData(){
$("#file").hide();
var data = $("#unparsed").html();
var parsed = $.parse(data);
$("#parsed").val(JSON.stringify(parsed));
})
http://jsbin.com/racanefi/10/edit
硬编码文本区域内的值。
$(function parseData(){
$("#file").hide();
var data = $("#unparsed").val();
var parsed = $.parse(data);
$("#parsed").val(JSON.stringify(parsed));
})
http://jsbin.com/racanefi/8/edit
或者
将值存储在 localStorage 中。
var storage = localStorage;
var key = 'unparsed_text_file';
function getFile(){
$("#file").change(function(){
var file = $(this).eq(0)[0].files[0],
reader = new FileReader();
reader.onload = function(e) {
var text = reader.result;
storage.setItem(key,text);
parseData();
};
reader.readAsText(file);
});
}
function parseData(){
$("#file").hide();
var data = storage.getItem(key);
var parsed = $.parse(data);
$("#unparsed").val(data);
$("#parsed").val(JSON.stringify(parsed));
}
if(storage.getItem(key))
parseData();
else
getFile();
http://jsbin.com/racanefi/6/edit
浏览器兼容性:
http://caniuse.com/namevalue-storage
这是一个粗略的草案，您可能应该在实现之前对其进行质量检查。
编辑:我有它向后 sessionStorage 在 session 之间是临时的。 localStorage 更永久。我创建了一个变量，可让您将存储分配给
var storage
关于javascript - 使用 Javascript 或 Jquery 自动导入本地 CSV 文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24172045/