我有一个JSON文件,它有:{ "a": "letter a", "b": "letter b", "c": "letter c" }当用户在文本框中键入“b”时,我如何将文本框中的字符串转换成键来访问JS中的JSON中的“b”键?
{ "a": "letter a", "b": "letter b", "c": "letter c" }
hrysbysz1#
首先从用户那里访问值,然后从对象那里访问值,怎么样?
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()">
iklwldmw2#
您可以使用方括号表示法来访问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'
0g0grzrc3#
下面是给定问题的解决方案:应用程序结构:
app.js文件
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文件
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文件
data.json
3条答案
按热度按时间hrysbysz1#
首先从用户那里访问值,然后从对象那里访问值,怎么样?
iklwldmw2#
您可以使用方括号表示法来访问JavaScript中JSON对象中特定键的值:
例如:
0g0grzrc3#
下面是给定问题的解决方案:
应用程序结构:
app.js
文件index.html
文件data.json
文件