Question

我对Javascript很新，所以我将详细介绍以下步骤来重新创建问题。我也设置了一个jsfiddle

重新创建问题的步骤：

从下拉列表1中选择“工作队列”。
从下拉列表2中选择“Google”。（Google显示 - 工作正常）。
从下拉列表2中选择“Yahoo”。（Yahoo显示 - 工作正常）。
从下拉列表1中选择“代理商”，然后从下拉列表2中选择“克莱尔”（显示克莱尔 - 工作正常）。
从下拉列表2中选择'Darren'（显示Darren - 工作正常）。
再次选择'工作队列'，从下拉列表1 ... Darren继续显示......这是问题）

为什么即使选择了不同的选项，Darren仍会继续显示？可以放置哪些代码来帮助解决这个问题？

非常感谢

HTML：

1。
          <td>
            <div>
              <select style="width: 100%; border-radius: 6px 6px 6px 6px; font-family: Sky Text Regular; font-size: 18px; padding:
5px;“height =”200px“＆gt; 选择类别... 工作队列代理
          <td>
            <div class="queuelist agentlist largetext">2. </div>
          </td>

          <td>
            <center>
              <div class="catlist" style="font-family: Sky Text Regular; font-size: 28px; color: #009CDD;"></div>
            </center>

            <div class="queuelist">
              <select style="width: 90%; border-radius: 6px 6px 6px 6px; font-family: Sky Text Regular; font-size: 18px; padding:
5px;“height =”200px“＆gt; 选择队列... 谷歌雅虎
            <div class="agentlist">
              <select style="width: 90%; border-radius: 6px 6px 6px 6px; font-family: Sky Text Regular; font-size: 18px; padding:
5px;“height =”200px“＆gt; 选择代理... 克莱尔达伦
              </select>
            </div>

          </td>
          </div>

        </tr>   </table> </center>
谷歌雅虎
<div class="claire agentcard">Claire</div>
<div class="darren agentcard">Darren</div> </center> </div>

Answer 1

虽然您在正确的选择菜单上触发了该功能，但您正在浏览每个选择菜单的所选选项元素，后续选择会删除您想要的效果。

替换它：

$(document).ready(function() {
  $("select").change(function() {
    $("select option:selected").each(function() {

使用：

$(document).ready(function() {
  $("select").change(function() {
    $(this).children("option:selected").each(function() {

要显示新显示的选择已选择的选项：为第二个选择添加更改触发器：

  if ($(this).attr("value") == "queuelist") {
   ....
  $(".queuelist").show();
    $(".queuelistselect").change();

（同样适用于＃34; agentlist＆＃34;）。

Working Fiddle - Edited

多次下拉过滤

1 个答案: