Javascript onkeyup事件

时间:2017-09-20 13:16:58

标签: javascript

我使用javascript的onkeyup事件在用户在表单字段中输入内容后显示日期。

日期显示正确,但在页面刷新时,日期消失。

如何在页面刷新后以及浏览器关闭后在我的视图中保留该日期?

以下是我的观点表单:

<div class="form-group">
    {{ Form::label('advance', 'Advance') }}
    {{ Form::text('advance', $worker->advance , array('class' => 'form-control',   'placeholder' => 'None', 'id' => 'advance', 'onkeyup=displayDate()')) }}

     <strong><p style="margin-top: 10px">Advance issued on : </p>
     </strong><p style="margin-top: 20px" id="date"></p>
 </div>

这是我的javascript函数,显示日期:

<script>
        function displayDate() {
            var x = document.getElementById("advance");
            document.getElementById("date").innerHTML = Date();
        }
</script>

1 个答案:

答案 0 :(得分:1)

使用cookies

您可以将数据保存在Cookie中,在页面加载时阅读并相应填写表单字段。

function createCookie(name, value, days) {
    var expires;
    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toGMTString();
    }
    else {
        expires = "";
    }
    document.cookie = name + "=" + value + expires + "; path=/";
}

function readCookie(c_name) {
    if (document.cookie.length > 0) {
        c_start = document.cookie.indexOf(c_name + "=");
        if (c_start != -1) {
            c_start = c_start + c_name.length + 1;
            c_end = document.cookie.indexOf(";", c_start);
            if (c_end == -1) {
                c_end = document.cookie.length;
            }
            return unescape(document.cookie.substring(c_start, c_end));
        }
    }
    return "";
}