将值从JavaScript传递/显示到HTML页面

passing/displaying values from JavaScript to HTML page

本文关键字:显示 HTML 页面 传递 JavaScript      更新时间:2024-02-05

我有以下JS代码,它们使用本地存储来显示之前输入的"姓名"answers"年龄":

此HTML代码当前在表中显示一个人的日期、时间、姓名和年龄。如何将这些值作为标签显示在HTML表单中,而不是在该表中?

HTML只显示开始时间,不显示姓名和年龄:

 <div id="history_list"></div>
    <div id="name"> </div>
    <div id="age"></div>

JS:

    function loadHistoryList() {
        for(var i = numberOfHistory; i >= 1; i--) {
            var historyData = new historyElement(db.getItem(i.toString()));
            if(historyData === null) {
                console.error('error');
                continue;
            }
            $('#history_list').append(historyData.startTime);
            $('#name').append(historyData.name);
            $('#age').append(historyData.age);
        }
    }

而不是

var div = '<div id="history_element"><div id="element_title">' + historyData.startDate + '&nbsp;&nbsp;&nbsp;' + historyData.startTime + '</div><table>';
var div = '<div id="name"><tr><td>name: </td><td>' + historyData.name+ '</td></tr>';
var div = '<div id="age"><tr><td>age: </td><td>' + historyData.age+ '</td></tr>';
div += '</table></div>';
$('#history_list').append(div);
$('#name').append(div);
$('#age').append(div);

这样做:

$('#history_list').append(historyData.startTime);
$('#name').append(historyData.name);
$('#age').append(historyData.age);

简而言之:您可以(在这种情况下也应该)简单地将所需的值添加到容器(DIV、Form字段或其他什么)

var div (...)开始的那三行覆盖了前一行,但这只是一个旁注
总的来说,您应该阅读更多关于JavaScript和/或JQuery的内容。

要填充表单字段,首先必须添加一个表单元素,如输入字段

HTML

<div id="history_list">
</div>
<input type="text" id="name" name="name">

JS

function loadHistoryList() {
for(var i = numberOfHistory; i >= 1; i--) {
        var historyData = new historyElement(db.getItem(i.toString()));
        if(historyData === null) {
            console.error('error');
            continue;
        }
        $('#name').val(historyData.name);
    }
}