Question

我有这个带下拉菜单的MVC Web应用程序：

@Html.DropDownListFor(model => model.Questions1, (SelectList)ViewData["Questions"], "Select>>", new { id = "Questions1", Name = "Questions1"})

@Html.DropDownListFor(model => model.Questions2, (SelectList)ViewData["Questions"], "Select>>", new { id = "Questions2", Name = "Questions2"})

这个jquery：

// Build a javascript array with all of the select names/values
var options = new Array();
$('#Questions1 option').each(function() {
    $this = $(this);
    options.push({ Name: $this.text(), Value: $this.val() });
});

// Create a function for re-building a select minus the chosen option
var rebuildSelect = function($selOption, $select) {
    $previouslySelected = $select.find(':selected');
    $select.empty();
    for (var i = 0; i < options.length; i++) {
        var opt = options[i];
        if (opt.Value != $selOption.val()) {
            if ($previouslySelected.val() == opt.Value) {
                $select.append('<option value="' + opt.Value + '" selected="selected">' + opt.Name + '</option>');
            }
            else {
                $select.append('<option value="' + opt.Value + '">' + opt.Name + '</option>');
            }
        }
    }
}

// Wire up the event handlers
var $Questions1 = $('#Questions1');
var $Questions2 = $('#Questions2');

$Questions1.change(function() {
    rebuildSelect($(this), $Questions2);
});

$Questions2.change(function() {
    rebuildSelect($(this), $Questions1);
});

// Go ahead and run the function on each box to remove the default entries from the other box
rebuildSelect($Questions1.find(':selected'), $Questions2);
rebuildSelect($Questions2.find(':selected'), $Questions1);

jquery代码的作用是删除第二个下拉列表中第一个下拉列表中的选定值，以便用户无法选择两个相同的问题。

我的问题是下拉菜单的默认值，即＆＃34;选择＆gt;＆gt;＆＃34;正在从第二次下拉列表中移除。

知道如何排除＆＃34;选择＆gt;＆gt;＆＃34;？提前谢谢！

Fiddle

Answer 1

是否有理由不能在不重建控件的情况下删除要删除的项目？

以下两种方法：一种方法将删除所选项目。另一个将根据其值删除项目。假设您的选项值是唯一的。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>
<body>
    <div>
        <select id="example">
            <option value="1">First</option>
            <option value="2">Second</option>
            <option value="3">Third</option>
        </select></div>
    <div>
        <a href="javascript:;" id="remove">Remove Selected</a></div>
    <div>
        <a href="javascript:;" id="removeSecond">Remove Second</a></div>
    <script type="text/javascript">
        $(function () {
            $("#remove").click(function () {
                var select = $("#example");
                var selected = select.find(":selected");
                selected.remove();
            });

            $("#removeSecond").click(function () {
                var select = $("#example");
                var second = select.find("[value=2]");
                second.remove();
            });
        });
    </script>
</body>
</html>

修改

这样做你想要的吗？而不是空，我调用$ select.find（“[value！= 0]”）。remove（）;这似乎与你描述的行为相符。

// Build a javascript array with all of the select names/values var options = new Array(); $('#Questions1 option:not(:first)').each(function() { $this = $(this); options.push({ Name: $this.text(), Value: $this.val() }); }); // Create a function for re-building a select minus the chosen option var rebuildSelect = function($selOption, $select) { $previouslySelected = $select.find(':selected'); $select.find("[value!=0]").remove(); for (var i = 0; i < options.length; i++) { var opt = options[i]; if (opt.Value != $selOption.val()) { if ($previouslySelected.val() == opt.Value) { $select.append('<option value="' + opt.Value + '" selected="selected">' + opt.Name + '</option>'); } else { $select.append('<option value="' + opt.Value + '">' + opt.Name + '</option>'); } } } } // Wire up the event handlers var $Questions1 = $('#Questions1'); var $Questions2 = $('#Questions2'); $Questions1.change(function() { rebuildSelect($(this), $Questions2); }); $Questions2.change(function() { rebuildSelect($(this), $Questions1); }); // Go ahead and run the function once to remove the default entry from the second box rebuildSelect($Questions1.find(':selected'), $Questions2);

Answer 2

我有类似的问题，所以我做的是在“选择＆gt;＆gt;”前插入一个Alt + 255字符串。您没有看到此Alt + 255 char。它是看不见的。然后在我的代码中我刚检查了第一个字符以排除它。

在mvc下拉列表中排除jquery函数的第一个值

2 个答案: