Question

我尝试为通过html表单字段更改的变量分配新值，然后单击按钮。此外，我希望更改的变量在html文件中更新，这样如果我刷新页面，新变量仍然存在而不会被原始变量替换

变量beforenoonprice是一个全局变量

HTML

  <input class="input-small" id="beforeNoonNPSlot" type="text">

的javascript

function updatePricingFunction(){
     beforenoonprice = document.getElementById("beforeNoonNPSlot").value();

    }

Answer 1

正如Mritunjay所说，你原来的问题是使用value()代替value。

关于重置，我对如何防止JavaScript中的值重置感到好奇并提出了一个问题：Prevent input value from resetting on refresh

它可以应用于您自己的代码，如下所示：

<input class="input-small" id="beforeNoonNPSlot" type="text">
<script>
    var myInput = document.getElementById("beforeNoonNPSlot");

    window.onload = function() {
        if (sessionStorage.getItem("autosave")) {
            myInput.value = sessionStorage.getItem("autosave");
            updatePricingFunction();
        }
    }

    myInput.addEventListener("keyup", function() {
        sessionStorage.setItem("autosave", myInput.value);
    });

    function updatePricingFunction() {
        beforenoonprice = myInput.value;
    }
</script>

要在浏览器关闭然后打开时保持该值，请使用localStorage：https://developer.mozilla.org/en/docs/Web/Guide/API/DOM/Storage#localStorage

<input class="input-small" id="beforeNoonNPSlot" type="text">
<script>
    if (!window.localStorage) {
        Object.defineProperty(window, "localStorage", new (function() {
            var aKeys = [], oStorage = {};
            Object.defineProperty(oStorage, "getItem", {
                value: function(sKey) { return sKey ? this[sKey] : null; },
                writable: false,
                configurable: false,
                enumerable: false
            });
            Object.defineProperty(oStorage, "key", {
                value: function(nKeyId) { return aKeys[nKeyId]; },
                writable: false,
                configurable: false,
                enumerable: false
            });
            Object.defineProperty(oStorage, "setItem", {
                value: function(sKey, sValue) {
                    if (!sKey) { return; }
                    document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
                },
                writable: false,
                configurable: false,
                enumerable: false
            });
            Object.defineProperty(oStorage, "length", {
                get: function() { return aKeys.length; },
                configurable: false,
                enumerable: false
            });
            Object.defineProperty(oStorage, "removeItem", {
                value: function(sKey) {
                    if (!sKey) { return; }
                    document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
                },
                writable: false,
                configurable: false,
                enumerable: false
            });
            this.get = function() {
                var iThisIndx;
                for (var sKey in oStorage) {
                    iThisIndx = aKeys.indexOf(sKey);
                    if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
                    else { aKeys.splice(iThisIndx, 1); }
                    delete oStorage[sKey];
                }
                for (aKeys; aKeys.length > 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
                for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx < aCouples.length; nIdx++) {
                    aCouple = aCouples[nIdx].split(/\s*=\s*/);
                    if (aCouple.length > 1) {
                        oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]);
                        aKeys.push(iKey);
                    }
                }
                return oStorage;
            };
            this.configurable = false;
            this.enumerable = true;
        })());
    }

    var myInput = document.getElementById("beforeNoonNPSlot");

    window.onload = function() {
        if (localStorage.getItem("autosave")) {
            myInput.value = localStorage.getItem("autosave");
            updatePricingFunction();
        }
    }

    myInput.addEventListener("keyup", function() {
        localStorage.setItem("autosave", myInput.value);
    });

    function updatePricingFunction() {
        beforenoonprice = myInput.value;
    }
</script>

在html表单字段中将javascript变量更改为value

1 个答案: