简单的

关于选择框的更改事件

$("#pay_method").change(function(){
  //Hide alldivshere
  $("#div").css("display","none")
 .
 .
  if($(this).val()=="1")
   $("#div").css("display","block")
  else if($(this).val()=="2")
   $("#div").css("display","block")
  .
  .     
});

最重要的是：考虑使用jQueryUI Accordion - 它实际上可以满足您的需求，而且需要的工作更少。

如果您想手动执行此操作，请跟踪 jQuery 事件change()并使用方法val()来获取所选值 - 正如其他答案中已经建议的那样。

看到这个小提琴。

HTML：

<select id="pay_method" name="pay_method">
  <option value="0" selected="selected">Select a Payment Method</option>
  <option value="1">Cash on Delivery</option>
  <option value="2">Credit Card</option>
  <option value="3">Debit Card</option>
  <option value="4">Netbanking</option>
</select>

<div id="cash_payment" class="payment_method">
  You selected <strong>cash</strong> payment method. 
</div>
<div id="credit_card_payment" class="payment_method">
  You selected <strong>credit card</strong> payment method. 
</div>
<div id="debit_card_payment" class="payment_method">
  You selected <strong>debit card</strong> payment method. 
</div>
<div id="netbanking_payment" class="payment_method">
  You selected <strong>netbanking</strong> payment method. 
</div>

JS：

$("#pay_method").change(function()
{
  $('.payment_method').slideUp();
  switch($('#pay_method :selected').val())
  {
    case '1': $('#cash_payment').slideDown(); break;
    case '2': $('#credit_card_payment').slideDown(); break;
    case '3': $('#debit_card_payment').slideDown(); break;
    case '4': $('#netbanking_payment').slideDown(); break;
  }
});

https://stackoverflow.com/questions/how-to-ask
http://api.jquery.com/

LIVE DEMO

CSS：

.hide{ display:none; }

jQuery：

$(function(){ // DOM ready

    $('[name=pay_method]').change(function(){
      $('.hide').hide()
      $('[data-panel='+ this.value +']').show(); 
    });

});

HTML：

<select name="pay_method">
  <option value="0" selected="selected">Select a Payment Method</option>
  <option value="1">Cash on Delivery</option>
  <option value="2">Credit Card</option>
  <option value="3">Debit Card</option>
  <option value="4">Netbanking</option>
</select>

<div class="hide" data-panel="1">Cash on Delivery</div>
<div class="hide" data-panel="2">Credit Card</div>
<div class="hide" data-panel="3">Debit Card</div>
<div class="hide" data-panel="4">Netbanking</div>

    var a =    $("#pay_method :selected").val();
     switch (a){
       case 1:
           HideAll()
           $("#div1").show();

       case 2:
           HideAll()
           $("#div2").show();
       case 3:
             HideAll()
           $("#div3").show();    
       case 4:
           HideAll()
           $("#div4").show();

             }

function HideAll(){

                   $("#div1").hide();

                 //hide other three divs also


                 }

$(document).ready(function () {
    $('#ddlPayment').change(function () {

       if($("#ddlPayment option:selected").val()==2)
             $('#creditcard').show();

      });
});

JS小提琴

<select name="pay_method" id="ddlPayment">
    <option value="0" selected="selected">Select a Payment Method</option>
    <option value="1">Cash on Delivery</option>
    <option value="2">Credit Card</option>
    <option value="3">Debit Card</option>
    <option value="4">Netbanking</option>
</select>
<div id="creditcard" style="display:none;">
    credit card details 
    <input type="text" />
</div>

尝试这个

<select id="pay_method">
  <option value="0" selected="selected">Select a Payment Method</option>
  <option value="1">Cash on Delivery</option>
  <option value="2">Credit Card</option>
  <option value="3">Debit Card</option>
  <option value="4">Netbanking</option>
</select>
<div id="1" class="Payment">Cash on Delivery Details</div>
<div id="2" class="Payment">Credit Card Details</div>
<div id="3" class="Payment">Debit Card Details</div>
<div id="4" class="Payment">Netbanking Details</div>

<script type="text/javascript">
 $(function() {
        $('#pay_method').change(function(){
            $('.Payment').hide();
            $('#' + $(this).val()).show();
        });
    });
</script>