我正在使用数据attr来选择,我想根据第一个select的data属性进行过滤。 这是我的代码,请让我知道什么?请原谅我代码的混乱,我是一个javascript / Jquery noob
html块/////////
<select id="selectOne">
<option data-team='{"team":"Engineering"}'>Engineering </option>
<option data-team='{"team": "Software"}'>Software Development</option>
<option data-team='{"team": "HumanResources"}'>Human Resources</option>
<option data-team='{"team": "MarkettingAndSales"}'>Marketting and Sales</option>
<option data-team='{"team": "Administrative"}'>Administrative</option>
<option data-team='{"team": "Others"}' class="others">Others</option>
</select>
<select id="selectTwo">
<option class="two" data-Speciality='{"team": "Software", "Speciality": "WebDevelopment"}'>Web Development </option>
<option class="two" data-Speciality='{"team": "Engineering", "Speciality": "WebApplication"}'>Application Development </option>
<option class="two" data-Speciality='{"team": "Software", "Speciality": "WebDevelopment"}'>UI/UX Design</option>
<option class="two" data-Speciality='{"team": "Others", "Speciality": "ScientificResearch"}'>Scientific / Research</option>
<option class="two" data-Speciality='{"team": "Engineering", "Speciality": "ScientificResearch"}'>Computer Hardware / Networking</option>
<option class="two" data-Speciality='{"team": "Others", "Speciality": "Others"}'>Others</option>
</select>
$(function(){
// function to use ajax calls to filter the table data depending on the select forms value
$("#selectOne").change(function() {
$("#selectTwo").hide();
var selected = $(this).find('option:selected');
$('#selectTwo option [data-team===selected]').show();
console.log( $(selected).data('team') );
//the filtering mechanism based on the class
});
///显然我没有得到第二个选择的值 任何线索为什么?
$(function(){
// function to use ajax calls to filter the table data depending on the select forms value
$("#selectOne").change(function() {
var selected=$(this).find('option:selected').data('team').teamName;
console.log(selected);
var selectTwo= $('#selectTwo').val().data('Speciality').team;
console.log(selectTwo);
})
答案 0 :(得分:1)
您无法显示/隐藏option
,至少不会在每个浏览器中显示。
你必须主动操作DOM,即根据你的过滤器逻辑删除和添加元素,你最终只会遇到简单的jQuery。
如果你需要这样的功能,我会选择任何与UI客户端数据分离的东西:here you can find很多解决方案。
答案 1 :(得分:1)
我想,你想要的是:
var selected = $(this).val();
$('#selectTwo').val(selected).show();
不确定您的期望。