会话存储不起作用答案

【问题标题】：sessionStorage won't work会话存储不起作用
【发布时间】：2015-04-29 08:21:41
【问题描述】：

好的，我有这个输入“textmoney”，它接受用户输入并显示他们一年可以赚多少钱。当用户按下回车键时，会弹出一个链接，该链接将转到另一个页面，该页面给出了对第一个答案的更精确估计。我想让第二页从第一页有一个“textmoney”的 sessionStorage，这样用户就不必再次输入数据。我对此进行了编码，但我似乎根本无法工作。我做错了什么？

首页：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script>

    $(document).ready(function() {

    var $demo = $('#demo');
    var $textMoney = $('#textmoney');
    var $moneydiv = $('#moneydiv');
    // Store
    sessionStorage.setItem("textmoney", $textMoney.val());

    $('#advanced').hide();

    function getmoney(){
        var money = $textMoney.val();
            if (isNaN(money) || money === '') {
                $demo.text('You aint enter no $$$$$$');
            } else {
                var dailyE = $textMoney.val() * 365;
                $demo.text('$' + dailyE + ' per day');
            }
    }

    // on enter key
    $textMoney.keydown(function(e) {
        if (e.which === 13) {
            getmoney();
            $('#advanced').show();
        } else if ($(this).val() === '') {
            $demo.text('');
            $('#advanced').hide();
        }

    }).mouseover(function() {
        $(this).css('border', '1px solid black');
    }).mouseout(function() {
        $(this).css('border', '1px solid grey');
    });

    // on click 
    $moneydiv.click(function(){    
        getmoney();
        $('#advanced').show();
    });

});
    </script>

第二页：

<body>
    <p id="workp"> How many days a week do you work? </p>
    <input type="text" id="workdays">
    <hr id="line1">

    <p id="taxesp"> What percent of taxes does the Government take? </p>
    <input type="text" id="taxes">
    <hr id="line2">

    <p id="bonusp"> What's your average yearly bonus? </p>
    <input type="text" id="bonus">
    <hr id="line3">

    <p id="demo"></p>
    <div id="calculate"> Calculate </div>

    <a href="moneyperday.html"> Back to calculator </a>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script>

        $(document.ready(function() {
        var $money = sessionStorage.getItem('textmoney');

        var $workdays = $('#workdays').val() * 52;
        var $moneynow = $money * $workdays;
        var $taxes = $('#taxes').val() / 100;
        var $bonus = $('#bonus').val();
        var $totalbalance = $moneynow * $taxes + $bonus;
        var $calculate = $('#calculate');


        function getmoney() {
            $demo.text($totalbalance + " " + "per day");
        }

        //on click
        $calculate.click(function() {
            getmoney();
        }


    })
    </script>

【问题讨论】：

标签： javascript jquery html session

【解决方案1】：

在第一页中，您将在页面加载后立即设置 sessionStorage。他们提交时您需要这样做：

function getmoney(){
    var money = parseInt( $textMoney.val() );
    sessionStorage.setItem("textmoney", money ); // Right here
    if (isNaN(money) || !money ) {
        $demo.text('You aint enter no $$$$$$');
    } else {
        var dailyE = money * 365;
        $demo.text('$' + dailyE + ' per day');
    }
}

还要注意我添加的parseInt()，只是为了确保该值被视为数字，而不是字符串（尽管在大多数浏览器中它可以在没有它的情况下工作）。

【讨论】：