[英]Creating a dynamic item list and display the the item as per user subscription
[英]Creating and overwriting variables dynamic per user input
在下面的代碼中,用戶可以通過輸入類型文本元素利用window
對象創建變量。 我編寫了一個函數,該控制台將記錄變量的名稱,后跟變量初始化的值0
。 僅當以下關鍵字字符串文字"-nr "
位於所創建變量的所需名稱之前時,才會發生這種情況。
本練習的目的是在將變量名稱重新輸入到輸入元素中時,將所有創建的變量值加1
。 我這樣做的嘗試是,首先編寫第一個函數varCreate
以將變量聲明為0
push
其初始化為0
, push
其push
入數組,然后在控制台中記錄變量名及其值。 我有(一個問題下一功能varPlus
)是指加1
時被輸入到然而所述輸入元件的特定名稱給每個值的值時,它增加了一些超過1
,甚至當我利用for
循環到計算輸入元素value屬性的字符串文字值是否等效於數組varArray
每個元素。
const _in = document.getElementById('in');
var varArray = [];
function varCreate(e) {
let _key = e.key;
if(_key === "Enter") {
if(_in.value.substring(0, 4) == "-nr ") {
window[_in.value.substring(4).replace(/\s/g, "_")] = 0;
varArray.push(_in.value.substring(4).replace(/\s/g, "_"));
console.log("var: " + varArray[varArray.length - 1] + "\nvalue: " + window[varArray[varArray.length - 1]]);
_in.value = "";
}
}
}
function varPlus(e1) {
let _key1 = e1.key;
if(_key1 === "Enter") {
checker = new RegExp(_in.value.replace(/\s/g, "_"), "gi");
for(var i = 0; i < varArray.length; i++) {
if(checker.test(varArray[i])) {
window[varArray[i]] += 1;
console.log("var: " + varArray[i] + "\nvalue: " + window[varArray[i]]);
}
}
delete window["checker"];
}
}
_in.addEventListener('keydown', varCreate);
_in.addEventListener('keydown', varPlus);
<input id='in' type='text' />
嘗試使用varPlus
時的最終結果是,它將控制台記錄所有變量名和變量,而這些值和變量只能以控制台方式記錄僅我嘗試通過用戶輸入訪問的變量名及其值。 如果有人能闡明我如何遇到這些錯誤,我將不勝感激。
首先,如果您嘗試使代碼可執行,那真的很有幫助:)
現在,對於用戶生成的變量,您可以執行以下操作:
// DOM Elements const input_variable = document.getElementById("input_variable"); const button_createVariable = document.getElementById("button_createVariable"); // Variables let userVariables = {}; // Event listeners window.addEventListener("keyup", event => {if(event.key == "Enter") parseVariable()}); button_createVariable.addEventListener("click", parseVariable); function parseVariable() { // Get the variable name and remove all spaces let variableName = input_variable.value.substring(0, input_variable.value.indexOf("=")).replace(/\\s+/g, ''); // Get the variable value and remove all spaces let variableValue = input_variable.value.substring(input_variable.value.indexOf("=") + 1, input_variable.value.length).replace(/\\s+/g, ''); // Add the variable to the object userVariables[variableName] = variableValue; // Clear the input input_variable.value = ""; // Log the object into the console console.log(userVariables); }
<input id='input_variable' type='text'/><button id="button_createVariable">Create</button>
警告當然,您仍然需要驗證用戶輸入。 在這種狀態下,它將接受所有內容作為輸入。 但是現在您可以遍歷該對象並計數(或其他)(如果已經存在)。
哦是的,語法很簡單: <name> = <value>
例如。 foo = 10
..不重要的細節:P
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.