jquery - 我想使用 jQuery 找到 Abhishek 的负责人
问题描述
我想比较关联数组中的值,并想打印我通过 Html 选择的人的头部
我的数组看起来像
var employee=[{"firstName":"Zahir","lastName":"Alam","Age":25,"Company":"Switchme","Role":"Developer","Department":"Tech","Head":{"Id":3,"Name":"Sourasis Roy"}},{"firstName":"Amith","lastName":"Manniken","Age":25,"Company":"Switchme","Role":"Developer","Department":"Tech","Head":{"Id":3,"Name":"Sourasis Roy"}},{"firstName":"Sourasis","lastName":"Roy","Age":28,"Company":"Switchme","Role":"CTO"},{"firstName":"Aditya","lastName":"Mishra","Age":29,"Company":"Switchme","Department":"Tech","Role":"CEO"},{"firstName":"Priti","lastName":"Lata","Age":24,"Company":"Switchme","Role":"HR"},{"firstName":"Sumita","lastName":"Nath","Age":24,"Company":"Switchme","Role":"HLA Head","Department":"Crm"},{"firstName":"Tarini","lastName":"Khanna","Age":22,"Company":"Switchme","Role":"Content Writer"},{"firstName":"Abhisek","lastName":"Soni","Age":23,"Company":"Switchme","Role":"HLA","Department":"Crm","Head":{"Id":5,"Name":"Sumita Nath"}},{"firstName":"Ankit","lastName":"Pump","Age":23,"Company":"Switchme","Role":"HLA","Department":"Crm","Head":{"Id":5,"Name":"Sumita Nath"}},{"firstName":"Pogo","lastName":"Laal","Age":23,"Company":"Switchme","Role":"Designer"},{"firstName":"Sabina","lastName":"Sekh","Age":28,"Company":"Switchme","Role":"HLA Head","Department":"Crm"},{"firstName":"Sanjay","lastName":"Poudal","Age":24,"Company":"Switchme","Role":"HLA Head","Department":"Crm","Head":{"Id":10,"Name":"Sabina Sekh"}}];
$(document).ready(function(){
$("select.employee").change(function(){
var selectedEmployee = $(this).children("option:selected").val();
$.each( employee, function( key, value ) {
if(employee["firstName"]==selectedEmployee) {
$("div.print").html("The head of"+selectedEmployee+"is"+employee["Head"]["Name"]);
}
});
});
});
<h3>1. Who is Head of </h3>
<select class="employee">
<option value="0">Select</option>
<option name="Amith" id="Amith" value="Amith" >Amith</option>
<option name="Sourasis" id="Sourasis" value="Sourasis">Sourasis</option>
<option name="Abhisek" id="Abhishek" value="Abhisek">Abhisek</option>
<option name="Sanjay" id="Sanjay" value="Sanjay">Sanjay</option>
</select>
解决方案
这是你要求的吗?
var employee = [{
"firstName": "Zahir",
"lastName": "Alam",
"Age": 25,
"Company": "Switchme",
"Role": "Developer",
"Department": "Tech",
"Head": {
"Id": 3,
"Name": "Sourasis Roy"
}
}, {
"firstName": "Amith",
"lastName": "Manniken",
"Age": 25,
"Company": "Switchme",
"Role": "Developer",
"Department": "Tech",
"Head": {
"Id": 3,
"Name": "Sourasis Roy"
}
}, {
"firstName": "Sourasis",
"lastName": "Roy",
"Age": 28,
"Company": "Switchme",
"Role": "CTO"
}, {
"firstName": "Aditya",
"lastName": "Mishra",
"Age": 29,
"Company": "Switchme",
"Department": "Tech",
"Role": "CEO"
}, {
"firstName": "Priti",
"lastName": "Lata",
"Age": 24,
"Company": "Switchme",
"Role": "HR"
}, {
"firstName": "Sumita",
"lastName": "Nath",
"Age": 24,
"Company": "Switchme",
"Role": "HLA Head",
"Department": "Crm"
}, {
"firstName": "Tarini",
"lastName": "Khanna",
"Age": 22,
"Company": "Switchme",
"Role": "Content Writer"
}, {
"firstName": "Abhisek",
"lastName": "Soni",
"Age": 23,
"Company": "Switchme",
"Role": "HLA",
"Department": "Crm",
"Head": {
"Id": 5,
"Name": "Sumita Nath"
}
}, {
"firstName": "Ankit",
"lastName": "Pump",
"Age": 23,
"Company": "Switchme",
"Role": "HLA",
"Department": "Crm",
"Head": {
"Id": 5,
"Name": "Sumita Nath"
}
}, {
"firstName": "Pogo",
"lastName": "Laal",
"Age": 23,
"Company": "Switchme",
"Role": "Designer"
}, {
"firstName": "Sabina",
"lastName": "Sekh",
"Age": 28,
"Company": "Switchme",
"Role": "HLA Head",
"Department": "Crm"
}, {
"firstName": "Sanjay",
"lastName": "Poudal",
"Age": 24,
"Company": "Switchme",
"Role": "HLA Head",
"Department": "Crm",
"Head": {
"Id": 10,
"Name": "Sabina Sekh"
}
}];
$(document).ready(function() {
$("select.employee").change(function() {
var selectedEmployee = this.value
$.each(employee, function(i, emp) {
if (emp.firstName == selectedEmployee) {
if (emp.Head) {
$("div.print").html("The head of " + selectedEmployee + " is " + emp.Head.Name);
} else {
$("div.print").html(selectedEmployee + " has no head! ");
}
}
});
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3>1. Who is Head of </h3>
<select class="employee">
<option value="0">Select</option>
<option name="Amith" id="Amith" value="Amith">Amith</option>
<option name="Sourasis" id="Sourasis" value="Sourasis">Sourasis</option>
<option name="Abhisek" id="Abhishek" value="Abhisek">Abhisek</option>
<option name="Sanjay" id="Sanjay" value="Sanjay">Sanjay</option>
</select>
<hr>
<div class="print"></div>
推荐阅读
- c++ - 如何让 Flycheck(使用 clang_complete)识别 Mojave 上的 OpenGL 框架
- python - Python 文件在正常运行时没有错误,但是当我在外部运行它时会出现错误显示图像
- reactjs - 如何同时进行包含路由和独占路由?
- sql - 如何使用条件语句根据不同的列分隔重复记录
- java - 在 Tomcat 上运行后,Web 服务验证失败
- qt - qml 地图在每次点击时显示指针图像
- firebase - 是否可以在 Firebase 中使用 curl 设置自定义声明?
- javascript - 使用 Mapbox GL JS 互斥的图层选择
- java - 如何修复我的 Arraylist 并将其设置在我的 ListView 中
- date - 如果日期从即将到来的星期日(包括即将到来的星期日)起超过 10 天,如何求和?