0 
filterJobs: function()
{
    var team = $('#selectOne').val();
    var specialty = $('#selectTwo').val();
    var level = $('#selectThree').val();
    //var defSelectTeam=

    $('.jobs').hide()
            .filter('[data-team="' + team + '"][data-specialization="' + specialty + '"][data-level="' + level + '"]')
            .show();
    var newNumJobs = $('.jobs:visible').length;
    $('table:visible:odd').css({'background-color': ' #F1F1F1'});
    $('table:visible:even').css({'background-color': '#FFFFFF'});
    if (newNumJobs <= this.pageSize)
    {
        $("#dvJobs span").text("Showing " + newNumJobs + " of " + newNumJobs + " jobs");
    }
    else
    {
        $("#dvJobs span").text("Showing " + this.pageSize + " of " + newNumJobs + " jobs");
    }

    this.buildPaginator(newNumJobs);
},

大家好，任何线索如何修改此过滤功能以进行选择过滤现在它可以工作，我需要设置一个默认值，在更改过滤之前显示所有选项？我只需要指出正确的大方向，我对 js 很垃圾，但正在努力改进。在此先感谢，html是这个//////，它通过从表格中删除数据属性来工作，该部分工作正常，只需要设置一个默认值，我正在考虑设置几个数据属性，但这似乎很乱。或设置一个检查值的 if 块，如果它的“选择一个”显示全部。抱歉扯淡了。

<select id="selectOne">
    <option value="Select One">Select One </option>
    <option value="Engineering">Engineering </option>
    <option value="SoftwareDevelopment" >Software Development</option>
    <option value="HumanResources" >Human Resources</option>
    <option value="MarkettingAndSales">Marketting and Sales</option>
    <option value="Administrative">Administrative</option>
    <option value="Others">Others</option>
</select>
<label>Specialty:</label>
<select id="selectTwo">
    <option class="Select One" >Select One </option>
    <option class="MarkettingAndSales" value="Sales">Sales </option>
    <option class="HumanResources" value="Recruitment">Recruitment </option>
    <option class="Administrative" value="OfficeGeneral">Office General </option>
    <option class="Engineering SoftwareDevelopment" value="WebDevelopment">Web Development </option>
    <option  class="SoftwareDevelopment" value="ApplicationDevelopment">Application Development </option>
    <option class="SoftwareDevelopment" value="UIUXDesign">UI/UX Design</option>
    <option class="Others" value="ScientificResearch">Scientific Research</option>
    <option  class="Engineering Others" value="ComputerHardwareNetworking">Computer Hardware  Networking</option>
    <option  class="Others" value="Others">Others</option>
</select>
<label>Level:</label>
<select id="selectThree">
    <option>Senior</option>
    <option>Intermediate</option>
    <option>Junior</option>
</select>

提前致谢。更新：我对其进行了一些修改以显示分页，但我想我在 if/else 块中使用了错误的 val 函数？

filterJobs: function()
{
    var team = $('#selectOne').val();
    var specialty = $('#selectTwo').val();
    var level = $('#selectThree').val();
    var newNumJobs = $('.jobs:visible').length;
    if (team === 'SelectOne' && specialty === 'SelectOne')
    {
        $('.jobs').show();
    }
    else
    {
        $('.jobs').hide()
                .filter('[data-team="' + team + '"][data-specialization="' + specialty + '"][data-level="' + level + '"]')
                .show();

        $('table:visible:odd').css({'background-color': ' #F1F1F1'});
        $('table:visible:even').css({'background-color': '#FFFFFF'});
    }
    if (newNumJobs <= this.pageSize)
    {
        $("#dvJobs span").text("Showing " + newNumJobs + " of " + newNumJobs + " jobs");
    }
    else
    {
        $("#dvJobs span").text("Showing " + this.pageSize + " of " + newNumJobs + " jobs");
    }


    this.buildPaginator(newNumJobs);
}

为了澄清起见，我添加了被过滤的标签，希望有助于理解我的问题。

<table data-team="<?php print $name['team']; ?>" data-specialization="<?php print $name['speciality']; ?>" data-level="<?php print $name['level']; ?>" cellpadding="0" cellspacing="0" border="0" width="670px" class="jobs"><tr><td>
    <tr><td colspan="4"><strong>Research Assistant</strong></td>
        <td></td><td></td><td></td></tr>
    <tr>
        <td width="100">Location : </td>
        <td colspan="3">Madrid</td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td> Job Code : </td>
        <td width="460">6767676</td>
        <td></td>
        <td></td> 
    </tr>
</table>
4

1 回答 1

1

我不是积极的我理解你的问题，但如果你只想要下拉菜单的默认选择，则不需要 jQuery。只需添加selected='selected'要在 html 中设置为默认值的选项即可。像这样：

<select id="selectOne">
    <option value="Select One">Select One </option>
    <option value="Engineering" selected="selected">Engineering </option>
    ...etc...

在这种情况下，您也可以摆脱“选择一个”选项，并将其设为标签或其他东西。

编辑：

如果需要，您还可以使用 jQuery 动态应用选定的过滤器：

$('#optionId').attr('selected', 'selected');

编辑2：

好的，请阅读有关原始问题的其他评论。我想我更清楚问题是什么。我同意在更改处理程序中进行过滤是最好的。就像是：

$('#selectOne, #selectTwo, #selectThree').change(filterJobs);

此外，如果您需要在页面加载时执行此过滤，请按照上面和 jQuery 调用设置“已选择”

$('#selectWhichever').trigger('change');

这将触发更改处理程序，而无需实际选择一个值。

于 2013-01-12T15:43:20.130 回答