无法在模态表单上显示隐藏下拉列表

时间:2015-02-02 07:56:08

标签: jquery html5 modal-dialog

我试图在我的模态表单上显示/隐藏下拉列表,但有些表示它不起作用 附上我的HTML代码。 代码有1个Drop-box有3个值,我想根据输入显示/隐藏另一个drop-box。 --html -

<div class="form-group">
  <div class="row">           
    <div class="col-md-3">
      <label>Contact Type: </label>
      <select id="ownership" data-placeholder="Select Ownership"  class="required select-full"  tabindex="2"  name="st">
        <option value="" selected></option>
        <option value="1">VIP</option>
        <option value="2">Collector</option>
        <option value="3">Client</option>

      </select>
    </div>

    <div id="vip" >

      <div class="col-md-3">
        <label>Sold To: <span class="mandatory">*</span></label>
        <select data-placeholder="USD" class="required select-full" id="soldto1" name="soldto1">
          <option value=""></option>
              </select>
      </div>

    </div>

    <div id="coll" >

      <div class="col-md-3">
        <label>Sold To: <span class="mandatory">*</span></label>
        <select data-placeholder="USD" class="required select-full" id="soldto2" name="soldto2">
          <option value=""></option>
           </select>
      </div>

    </div>

    <div id="clil" >

      <div class="col-md-3">
        <label>Sold To: <span class="mandatory">*</span></label>
        <select data-placeholder="USD" class="required select-full" id="soldto3" name="soldto3">
          <option value=""></option>
               </select>
      </div>
    </div>
 </div>

enter image description here

- jQuery的 -

 <script type='text/javascript'>//<![CDATA[ 
  $(document).ready(function() {
    $('#vip').hide();
    $('#coll').hide();
    $('#clil').hide();
    $('#ownership').change(function() {

      if ($('#ownership option:selected').text() == 'VIP') {
        $('#vip').show();
        $('#coll').hide();
        $('#clil').hide();

      }
      if ($('#ownership option:selected').text() == 'Collector') {
        $('#vip').hide();
        $('#coll').show();
        $('#clil').hide();
      } if ($('#ownership option:selected').text() == 'Client') {
        $('#vip').hide();
        $('#coll').hide();
        $('#clil').show();
      }
    });
  });
</script>

让我知道我做错了什么。

0 个答案:

没有答案