如何根据html select元素更改其他对象

Question

我正在实施图形界面来管理网站上的角色。我使用带有Razor的ASP.NET MVC来显示视图

这是我当前的屏幕：

以下是我的组合框代码：

   <p>
    <label>Select User</label>
    <span class="field">
        <select name="userSelect">
            <option value="">Choose One</option>
            @foreach (var item in Model.Users)
            {
                <option value="@item.Id">@item.UserName</option>
            }
        </select>
    </span>
</p>

现在很明显，当该人选择用户时，我希望将相应的角色加载到下面的双重选择中。

根据我的阅读，我将需要使用jQuery，但是我之前没有做过任何jQuery，所以一些不错的例子会很棒。

这是我的双选择代码，但它没有任何动态代码用正确的字段填充它，但显然这个帖子的答案会影响它的完成方式。

<p>
    <label>Select Roles</label>
    <span id="dualselect" class="dualselect">
        <select name="RolesSelect" multiple="multiple" size="10">
            <option value="">Admin</option>
            <option value="">User</option>
            <option value="">Technical</option>
            <option value="">Sales</option>
            <option value="">End User</option>
            <option value="">Cient<option>
        </select>
        <span class="ds_arrow">
            <span class="arrow ds_prev">&laquo;</span>
            <span class="arrow ds_next">&raquo;</span>
        </span>
        <select name="select4" multiple="multiple" size="10">
            <option value=""></option>
        </select>
    </span>
</p>

Answer 1

你不需要来使用JQuery，但它可能是初学者最快捷/最简单的方法。

http://learn.jquery.com/javascript-101/getting-started/