我想从一个html表单存储到一个JSON文件在网页本身的输入

i want to store the input from an html form to an JSON file in the webpage itself

本文关键字:一个 网页 输入 文件 表单 html 存储 JSON      更新时间:2023-09-26

现在值被存储在服务器上的数组中,但我想将其存储在客户端仅在网页本身。我需要将HTML表单生成的表单数据写入一个json文件,它应该留在页面本身不发送到服务器。这就好像我在给一个对象赋名字和值。

<!doctype html>
<html>
<head>
<title>jQuery UI Dialog - Default functionality</title>
<style>
body {
font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
font-size: 62.5%;
}
</style>
<link rel="stylesheet" href="jquery-ui.css">
<script src="jquery-1.11.1.js"></script>
<script src="jquery-ui.js"></script>
<script>
$(document).ready(function() { 
$('path') .dblclick(function(){
$(function() {
$( "#dialog" ).dialog();
});
});
});
</script>
</head>
<body>
<svg width="80" height="32">
<path d="M10 15 l15 0 l2.5 -5 l5 10 l5 -10 l5 10 l5 -10 l5 10 l2.5 -5 l15 0"       stroke="black" stroke-width="2px" stroke-linejoin="bevel" fill="none"></path>
</svg>
<div id="dialog" title="Basic dialog" style="display:none">
<form action="array.php" method="post">
Component-ID: <input type="text" name="id"><br>
Componentval: <input type="text" name="var"><br>
<input type="submit" value="Submit">
</form>
</div>
</body>
</html>

像这样应该可以工作

<form onsubmit="processForm();">
<script>
var object = {};
function processForm()
{
    object = {
        id: document.getElementById("id").value,
        var: document.getElementById("var").value
    };
    return false;
}
</script>

虽然我会做一些值验证检查,以确保您的元素存在等…