<label for="currencyListFrom">From:</label><select id="currencyListFrom" onchange="callCurrFrom(this)" name="cf" form="currencyform"> <option value="none" selected disabled hidden>Select Currency From</option> <option value="EUR" label="EURO" selected>EUR</option></select><label for="currencyListTo">To:</label><select id="currencyListTo" onchange="callCurrTo(this)" name="ct" form="currencyform"> <option value="none" selected disabled hidden>Select Currency To </option> <option value="USD" label="US dollar" selected>USD</option></select><script> //sessionStorage stores the data for one session until web browser is open function callCurrFrom(obj) { //setItem() accept key, keyvalue pair sessionStorage.setItem( "selectedCur", obj.options[obj.selectedIndex].value ); // id value stored document.getElementById("currencyListFrom").value = obj.options[obj.selectedIndex].value; } // Retrieve Value document.getElementById("currencyListFrom").value = sessionStorage.getItem( "selectedCur" ); function callCurrTo(obj) { sessionStorage.setItem( "selectedCurr", obj.options[obj.selectedIndex].value ); document.getElementById("currencyListTo").value = obj.options[obj.selectedIndex].value; } document.getElementById("currencyListTo").value = sessionStorage.getItem( "selectedCurr" );</script>我以這種方式編碼，以便 JavaScript 會記住所選的下拉列表，如果我選擇相應的貨幣并提交表單，則所選的值不會消失，這很好，但是當頁面第一次加載時，我無法查看我的默認選項，它們是空白的，有什么辦法解決這個問題，謝謝圖像
1 回答
互換的青春
TA貢獻1797條經驗 獲得超6個贊
有幾點需要注意：
你
selected對所有的選擇都有支持currencyListFrom你的 javascript 總是設置 sessionStorage 中和元素的值currencyListTo，即使那里什么也沒有。這實際上是將值設置為未定義。
解決這些問題似乎可以解決問題：
<label for="currencyListFrom">From:</label>
<select
id="currencyListFrom"
onchange="callCurrFrom(this)"
name="cf"
form="currencyform"
>
<option value="none" disabled hidden>Select Currency From</option>
<option value="EUR" label="EURO">EUR</option></select
>
<label for="currencyListTo">To:</label>
<select
id="currencyListTo"
onchange="callCurrTo(this)"
name="ct"
form="currencyform"
>
<option value="none" disabled hidden>Select Currency To </option>
<option value="USD" label="US dollar">USD</option>
</select>
<script>
// wrap in IIFE in order to not pollute global scope
(function() {
//sessionStorage stores the data for one session until web browser is open
function callCurrFrom(obj) {
//setItem() accept key, keyvalue pair
sessionStorage.setItem(
"selectedCur",
obj.options[obj.selectedIndex].value
);
// id value stored
document.getElementById("currencyListFrom").value =
obj.options[obj.selectedIndex].value;
}
var defaultFrom = sessionStorage.getItem(
"selectedCur"
);
if (defaultFrom) { // ensure it's not falsey
document.getElementById("currencyListFrom").value = defaultFrom
}
function callCurrTo(obj) {
sessionStorage.setItem(
"selectedCurr",
obj.options[obj.selectedIndex].value
);
document.getElementById("currencyListTo").value =
obj.options[obj.selectedIndex].value;
}
var defaultTo =sessionStorage.getItem(
"selectedCurr"
);
if (defaultTo) { // ensure it's not falsey
document.getElementById("currencyListTo").value = defaultTo
}
})();
</script>
- 1 回答
- 0 關注
- 161 瀏覽
添加回答
舉報
0/150
提交
取消