Question

我的问题是当我在任何一个选择框中选择一个选项，然后在其他选择框中选择另一个选项时，这些值会自动更改。我该怎么解决这个问题。我想根据我的选择过滤值，并在不使用插件的情况下将其显示在表中。

Here is my code:

http://jsfiddle.net/pW6P6/4/

Answer 1

我将您的排序功能合并到一个功能中。

即 fxnSelectYear，fxnSelectMake，fxnSelectModel，fxnSelectSubModel to fxnUpdateGrid

如果您可以将fxnReLoading ..功能与一个结合起来会更好。

DEMO

希望这会有所帮助。随意问我问题。

Answer 2

如果你想保存你的逻辑。您可以在删除每个选项之前保存所选值，并在重新初始化选择值后选择它：

http://jsfiddle.net/pW6P6/9/

var selected = $('#DropDown_Year option:selected').val();
$('#DropDown_Year option[value]').remove();
iHtmlYear = fxnOptions(g_YearsArray);
$('#DropDown_Year').append(iHtmlYear);
$("#DropDown_Year option[value=" + selected + "]").attr("selected", true);

Answer 3

哇哇，这对于这么小的任务来说就是很多代码......

无论如何，在你的每个“更改功能”中，你正在重新加载其他过滤选择。这就是重置选择框的原因

e.g：

fxnSelectMake = function () {
    $('#tableID tr').remove();
    g_newRows = "";
    $.each(g_Vehicle, function (index) {
        if (g_Vehicle[index].Make == $('#DropDown_Make').val()) {
            fxnCreateRow(g_Vehicle, index);
        }
    });
    $('#tableID').append(g_newRows);
    fxnReLoadingModelFilters();         // <-- this is what i mean
    fxnReLoadingSubModelFilters();      // <-- and this
    fxnReLoadingYearFilters();          // <-- and this

},

但这只是第一部分。你的主要问题是这段代码：

$.each(g_Vehicle, function (index) {
  if (g_Vehicle[index].Make == $('#DropDown_Make').val()) {
    fxnCreateRow(g_Vehicle, index);
  }
});

你的g_Vehicle-Object在这里仍然是TOTAL对象，你只是检查当前选中的值（不是年份等等）

我编写了一个函数“isInIndex”，它检查所有4个当前选定的值，并且只有当前车辆行对所有4个选择框有效时才返回true：

isInIndex = function(vehicle) {
  return ($("#DropDown_Year").prop("selectedIndex") === 0 || vehicle.Year === $('#DropDown_Year').val()) &&
      ($("#DropDown_Make").prop("selectedIndex") === 0 || vehicle.Make === $('#DropDown_Make').val()) &&
      ($("#DropDown_Model").prop("selectedIndex") === 0 || vehicle.Model === $('#DropDown_Model').val()) &&
      ($("#DropDown_SubModel").prop("selectedIndex") === 0 || vehicle.SubModel === $('#DropDown_SubModel').val())
}

然后我在每个“变更函数”中调用此函数：

$.each(g_Vehicle, function (index) {
  if (isInIndex(g_Vehicle[index])) {
    fxnCreateRow(g_Vehicle, index);
  }
});

这里更新和工作的小提琴：http://jsfiddle.net/pW6P6/10/

编辑：代码中可能有很多优化可能性，其中之一是你应该将jQuery-Objects保存到变量中，并使用它们：

例如：

var $dropDownMake = $('#DropDown_Make');

// and later
$dropDownMake.val()

在选择框jquery中选择选项和过滤器值

3 个答案: