英文:
Convert a string into JSON key in JavaScript
问题
当用户在文本框中输入“b”时，如何将文本框中的字符串转换为用于访问JSON中“b”键的键值对应关系在JavaScript中是这样的：
var json = {
"a": "letter a",
"b": "letter b",
"c": "letter c"
};
var userInput = "b"; // 用户在文本框中输入的值
var value = json[userInput]; // 使用用户输入作为键来访问JSON中的值
这样，变量value将包含JSON中键为“b”的值，“letter b”。
英文:
I have a JSON file that has:
{
"a": "letter a",
"b": "letter b",
"c": "letter c"
}
When the user type in the textbox "b", how do I convert the string from the textbox into a key to access the "b" key in the JSON in JS?
答案1
得分: 1
从用户首先获取值，然后再获取对象的值，可以尝试以下代码：
function myFunction() {
var obj = { "a": "letter a", "b": "letter b", "c": "letter c" };
var userInput = document.getElementById("user-input").value;
if(userInput){
console.log(obj[userInput] ?? "not found");
}
}
Enter value: <input type="text" id="user-input" onkeyup="myFunction()">
请注意，这是 JavaScript 和 HTML 代码的翻译。
英文:
How about accessing the value from the user first and then accessing the value from object.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
function myFunction() {
var obj = { "a": "letter a", "b": "letter b", "c": "letter c" };
var userInput = document.getElementById("user-input").value;
if(userInput){
console.log(obj[userInput] ?? "not found");
}
}
<!-- language: lang-html -->
Enter value: <input type="text" id ="user-input" onkeyup="myFunction()">
<!-- end snippet -->
答案2
得分: 1
你可以使用方括号表示法来在JavaScript中访问JSON对象中特定键的值：
var value = jsonObject['userInput'];
例如：
const jsonObject = JSON.parse('{ "a": "letter a", "b": "letter b", "c": "letter c" }');
var userInput = document.getElementById('textbox').value; // userInput = 'b'
var value = jsonObject[userInput];
console.log(value); // 'letter b'
英文:
You can use the square bracket notation to access the value of a specific key in a JSON object in JavaScript:
var value = jsonObject['userInput'];
For example:
const jsonObject = JSON.parse('{ "a": "letter a", "b": "letter b", "c": "letter c" }');
var userInput = document.getElementById("textbox").value; // userInput = 'b'
var value = jsonObject[userInput];
console.log(value); // 'letter b'
答案3
得分: 1
这是给定问题的解决方案：
应用程序结构：
app.js 文件
const textBox = document.getElementById("textbox");
const valueBox = document.getElementById("valuebox");
let data;
async function main() {
await fetch("/data.json").then(async (v) => {
data = await v.json();
});
console.log(data);
}
textBox.addEventListener("change", () => {
let k = textBox.value;
valueBox.innerHTML = data[k];
});
main();
index.html 文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input id="textbox" />
<div id="valuebox"></div>
</body>
<script src="./app.js"></script>
</html>
data.json 文件
{ "a": "letter a", "b": "letter b", "c": "letter c" }
英文:
Here's the solution for a given problem:
App Structure:
app.js file
const textBox = document.getElementById("textbox");
const valueBox = document.getElementById("valuebox");
let data;
async function main() {
await fetch("/data.json").then(async (v) => {
data = await v.json();
});
console.log(data);
}
textBox.addEventListener("change", () => {
let k = textBox.value;
valueBox.innerHTML = data[k];
});
main();
index.html file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input id="textbox" />
<div id="valuebox"></div>
</body>
<script src="./app.js"></script>
</html>
data.json file
{ "a": "letter a", "b": "letter b", "c": "letter c" }
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论