gpt4 book ai didi

javascript - 如何根据我的下拉菜单打印出我的对象属性?

转载 作者:行者123 更新时间:2023-12-03 09:55:16 24 4
gpt4 key购买 nike

我有一个下拉菜单,其中包含选项:A、B。我有 2 个对象:A、B。

他们的属性(property)是

var A = { name:"Andrew", age:26, country:"United States" };
var B = { name:"Barry", age:23, country:"Italy" };

我想在从下拉菜单中选择 A 时显示 A 信息,反之亦然。

<!DOCTYPE html>
<html>

<head>
<title>JSON</title>
</head>

<body>

<form>
Student :
<select id="dd" onchange="myStudent()">
<option value="A">A</option>
<option value="B">B</option>
</select>

<p>Selected Student :
<input type="text" id="student" size="2" value="A">
</p>
</form>

<div id="result">Details :
<br>
</div>

</body>
<script type="text/javascript">
function myStudent() {


var dd = document.getElementById("dd");
var selected = dd.options[dd.selectedIndex].text;
document.getElementById("student").value = selected;
}

var A = {
name: "Andrew",
age: 26,
country: "United States"
};
var B = {
name: "Barry",
age: 23,
country: "Italy"
};

var result = document.getElementById("result");

result.innerHTML += JSON.stringify(A, undefined, 6);
</script>

</html>

我无法B显示。有人可以给我一些提示吗?

Here is my JSFiddle

最佳答案

您从未在 myStudent() 调用中更改文档 HTML。

首先,我将定义 selectionsselections["A"]selections["B"] 的代码移至myStudent() 函数,这样它就不会是未定义的。

我将 AB 移动到 selections 对象中,以避免在将选择传递到时出现一些令人讨厌的 eval JSON.stringify 函数。否则,为了将对象传递到 JSON.stringify 函数中,我需要执行类似 JSON.stringify(eval(selected), undefined, 6); 的操作这是丑陋的,而且是不好的做法。

然后我输入代码来查找在 myStudent 函数中选择了哪一个。

我仍然不确定参数 undefined6JSON.stringify 中的用途。希望比我更有启发的人能够发表评论。

代码应该可以工作。

<!DOCTYPE html>
<html>

<head>
<title>JSON</title>
</head>

<body>

<form>
Student :
<select id="dd" onchange="myStudent()">
<option value="A">A</option>
<option value="B">B</option>
</select>

<p>Selected Student :
<input type="text" id="student" size="2" value="A">
</p>
</form>

<div id="result">Details :
<br>
</div>

</body>
<script type="text/javascript">

var selections = {};
selections["A"] = {
name: "Andrew",
age: 26,
country: "United States"
};
selections["B"] = {
name: "Barry",
age: 23,
country: "Italy"
};

function myStudent() {

var dd = document.getElementById("dd");
var selected = dd.options[dd.selectedIndex].text;
document.getElementById("student").value = selected;

var result = document.getElementById("result");
result.innerHTML = JSON.stringify(selections[selected], undefined, 6);
}

var result = document.getElementById("result");
result.innerHTML = JSON.stringify(selections["A"], undefined, 6);

</script>

</html>

关于javascript - 如何根据我的下拉菜单打印出我的对象属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30758079/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com