Пользовательский ввод HTML в локальный файл - PullRequest
0 голосов
/ 07 ноября 2019

Я пытаюсь создать форму с HTML и javascript, чтобы иметь возможность получить 3 различных ввода от пользователя, объединить их в 1 форму в формате json и сохранить файл в локальном расположении файла. Ниже то, что у меня сейчас есть. (Мне неясно, как я могу сохранить строку JSON в локальном файле. Спасибо за ваше время заранее. (Я новичок в JavaScript и HTML)

<header class="banner">
<h1 style="color:blue">HTML User Input to local file location</h1><main>
    <form id="myform" type="post">
        <fieldset>
            <legend style="color:blue">Sign Up</legend>
            <p style="color:red">Write your con-fig codes below</p>
            <div class="elements">
                <label for="Input1">Input1 :</label>
                <input required="required" type="text" onfocus="this.value=''" value="Input1" 
name="Input1" size="25" />
            </div>
            <div class="elements">
                <label for="Input2">Input2 :</label>
                <input required="required" type="text" onfocus="this.value=''" value="Input2" 
name="Input2" size="25" />
            </div>
            <div class="elements">
                <label for="Input3">Input3 :</label>
                <input required="required" type="text" onfocus="this.value=''" value="Input3" 
name="Input3" size="25" />
            </div
            <div class="submit">
                <input type="submit" id="btn" name="submit" class="btn" value="Send" />
            </div>
        </fieldset>
    </form>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#btn").click(function(e) {
                var jsonData = {};

                var formData = JSON.stringify($("#myForm").serializeArray());

                $.each(formData, function() {
                    if (jsonData[this.name]) {
                        if (!jsonData[this.name].push) {
                            jsonData[this.name] = [jsonData[this.name]];
                        }
                        jsonData[this.name].push(this.value || '');
                    } else {
                        jsonData[this.name] = this.value || '';
                    }

                });
                e.preventDefault();
            });
        });

    </script>
    </main>

1 Ответ

0 голосов
/ 07 ноября 2019

Это определенно спрашивалось раньше в нескольких местах. Как Здесь и Здесь . Код скопирован с одной из ссылок ниже

function download(content, fileName, contentType) {
    var a = document.createElement("a");
    var file = new Blob([content], {type: contentType});
    a.href = URL.createObjectURL(file);
    a.download = fileName;
    a.click();
}
download(jsonData, 'json.txt', 'text/plain');

Кредит @ Rafał Łużyński.

Пожалуйста, поищите решения лучше, прежде чем задавать вопрос.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...