进行下拉选择时显示/隐藏<div>部分

Question

我有一个下拉列表，当从中选择某些内容时，某些div需要隐藏或显示。我有这个工作的另一个下拉，基本上控制页面的整个视图，但我不能让这个下降工作，代码几乎相同。我尝试了很多不同的东西。

这是JQuery代码

$(document).ready(function () {

    $("#ChangeRequestType").focus();


    $("#ChangeRequestType").change(changeRequestDisplay);


    changeRequestDisplay();

});

更多代码：

function changeRequestDisplay() {

    var action = $("#ChangeRequestType").val();

    if (action == "N/A") {
        DisplayOnlyDefaultChangeMenu();

    }
    else if (action == "Description") {
        DisplayDescriptionChange();

    }
    else if (action == "Procurement Category") {
        DisplayProcurementCategoryChange();

    }
    else if (action == "NonStandard Conversions") {
        DisplayNonStandardChangeRequest();

    }
    else if (action == "Item Group") {
        DisplayItemGroupChange();

    }
    else if (action == "Extended Description") {
        DisplayExtDescriptionChange();

    }
    else if (action == "More") {
        DisplayMultipleChange();
    }

}

更多代码：

 function DisplayOnlyDefaultChangeMenu() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#ExtDescriptionRequest").hide("slow");
    $("#ItemGroupChange").hide("slow");

    $("#DescriptionRequest").hide("slow");
    $("#ProcurementCategoryRequest").hide("slow");
    $("#NonStandardConversionRequest").hide("slow");

}
function DisplayExtDescriptionChange() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#ExtDescriptionRequest").show("slow");
    $("#ItemGroupChange").hide("slow");

    $("#DescriptionRequest").hide("slow");
    $("#ProcurementCategoryRequest").hide("slow");
    $("#NonStandardConversionRequest").hide("slow");

}


function DisplayDescriptionChange() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#DescriptionRequest").show("slow");
    $("#ProcurementCategoryRequest").hide("slow");
    $("#NonStandardConversionRequest").hide("slow");
    $("#ExtDescriptionRequest").hide("slow");
    $("#ItemGroupChange").hide("slow");
}
function DisplayProcurementCategoryChange() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#DescriptionRequest").hide("slow");
    $("#ProcurementCategoryRequest").show("slow");
    $("#NonStandardConversionRequest").hide("slow");
    $("#ExtDescriptionRequest").hide("slow");
    $("#ItemGroupChange").hide("slow");
}
function DisplayNonStandardChangeRequest() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#DescriptionRequest").hide("slow");
    $("#ProcurementCategoryRequest").hide("slow");
    $("#NonStandardConversionRequest").show("slow");
    $("#ExtDescriptionRequest").hide("slow");
    $("#ItemGroupChange").hide("slow");
}
function DisplayItemGroupChange() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#DescriptionRequest").hide("slow");
    $("#ProcurementCategoryRequest").hide("slow");
    $("#NonStandardConversionRequest").hide("slow");
    $("#ExtDescriptionRequest").hide("slow");
    $("#ItemGroupChange").show("slow");
}
function DisplayMultipleChange() {

    $("tr").show();
    $("#salesSetups").hide("slow");
    $("#requiredInfo").show("slow");
    $("#purchaseBUTable").show("slow");
    $("#fullAndBasicSetup").hide("slow");
    $("#fullAndSalesSetup").hide("slow");
    $("#salesProcurementExtras").hide("slow");

    $("#changeRequests").show("slow");
    $("#DescriptionRequest").show("slow");
    $("#ProcurementCategoryRequest").show("slow");
    $("#NonStandardConversionRequest").show("slow");
    $("#ExtDescriptionRequest").show("slow");
    $("#ItemGroupChange").show("slow");
}

这是我尝试实施所有内容的地方

<div class="span-18 last" id="changeRequests">
  <table class="item-display">
    <tr>
      <td class="label required">Change Request Type</td>
      <td class="value" colspan="5">
        @Html.DropDownList("ChangeRequestType", new List<SelectListItem>
          {
            new SelectListItem { Text ="Select Option", Value="N/A"},
            new SelectListItem { Text ="Item Group", Value="Item Group" },
            new SelectListItem { Text ="Description", Value="Description" },
            new SelectListItem { Text ="Extended Description", Value="Extended Description" },
            new SelectListItem { Text ="Procurement Category", Value="Procurement Category" },
            new SelectListItem { Text ="NonStandard Conversion", Value="NonStandard Conversions" },
            new SelectListItem { Text ="More Than One Change Type", Value="More" },

          }, new { onchange = "changeRequestDisplay()"})
      </td>
    </tr>

我已经对<div> ID进行了双倍和三倍检查，以及下拉选项的值，如100000次，并且似乎没有问题，所以我不能似乎找出了问题，无论选择什么，它们都会隐藏起来。

Answer 1

要获得所选值，您应该使用

$("#ChangeRequestType option:selected").val();

一定会解决你的问题

Answer 2

这一行是问题所在：

<script> var min = 0; var max = 10; var random = Math.floor(Math.random() * (max - min +1)) + min; document.write(random); var tryCount = 0; function takeMynumber() { ++tryCount; if (tryCount > 5) { alert("You already used your 5 tries"); return; } var myRandom = parseInt(document.getElementById("numberInput").value); if (myRandom == random){ document.getElementById("textOutput").innerHTML = "Good Job <br/> Now try guess number between 0-100"; } if (myRandom < random){ document.getElementById("textOutput").innerHTML = "Greater than: " + myRandom; } if (myRandom > random){ document.getElementById("textOutput").innerHTML = "Less than: " + myRandom; } } </script>

尝试$("tr").show();