Jquery链接选择任何线索我做错了什么？答案

【问题标题】：Jquery chained selects any clues what I'm doing wrong?Jquery链接选择任何线索我做错了什么？
【发布时间】：2012-12-22 06:07:10
【问题描述】：

我是使用data attr进行选择，我想根据第一次选择的data属性进行过滤。这是我的代码，请告诉我什么？请原谅我的代码混乱，我是 javascript/Jquery 菜鸟

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);

})

【问题讨论】：

发布您的 HTML 或将其设为 jsfiddle.net。
@AleksandrM，我的 html 已发布，它的选择部分，我想了解为什么这不起作用，已经使用类将其过滤掉，但认为数据 api 应该能够做类似的事情东西

标签： javascript jquery dom data-binding

【解决方案1】：

你不能像那样显示/隐藏options，至少不是在每个浏览器中。

您必须主动操作 DOM，即根据您的过滤器逻辑删除和添加元素，而仅使用普通的 jQuery，您最终会变得一团糟。

如果您需要这样的功能，我会选择任何将数据与 UI 客户端分离的方法：here you can find 很多解决方案。

【讨论】：

谢谢，决定改用插件

【解决方案2】：

我想，你想要的是：

var selected = $(this).val();    
$('#selectTwo').val(selected).show();

不确定您的期望。

【讨论】：

我试过了，还是不行，不过还是谢谢你的建议。我会看看@moonwave99 的建议。
我希望更改所选选项的值，我已经使用我要操作的 html 块编辑了问题。