Question

在下面的代码中，除了select之外的所有div都是＆＃34; display：none＆＃34; （在CSS中）开始。当有人从Select下拉列表中选择一个选项时，jquery会执行但是在＆＃34; typeChosen（）＆＃34;函数，只执行第一行（显示所有具有＆＃34类的div;总是＆＃34;）。用于查看＆＃34; size＆＃34;的代码在课堂上，如果是这样的话，显示所有div的等级＆＃34; size＆＃34;没有执行。

基本上，如果其中一个选项带有＆＃34; size＆＃34;在课程中选择，底部的所有4个div应该出现。如果选项没有＆＃34;大小＆＃34;在课堂上是选择，然后只会显示前3个div。

我是否必须在Jquery中执行不同的操作才能执行多行？我可能是错的，但似乎只是做第一行并停止。

    $(document).ready(function () {
    $("#typeofrequest").change(function () {
        typeChosen();
    });
    $( "#datepicker" ).datepicker();

});
function typeChosen() {
    $(".always").show();
    $('#typeofrequest').on( 'change', function( e ) {
      if( $(this).find('option:selected').hasClass("size") )
          $('div.size').show();
      else
          $('div.size').hide();
     });
}



        <form action="process-request.php" method="post">
  <select id="typeofrequest" name="type">
    <option value="">PLEASE SELECT</option>
    <option value="email" class="size">LOGsdfgdfgsdgdfgt</option>
    <option value="email" class="size">LOGO - Logo request</option>
    <option value="email" class="size">EMAIL - Graphic</option>
    <option value="social" class="size">SOCIAL MEDIA - Graphic</option>
    <option value="" class="size">LANDING PAGE - Graphic</option>
    <option value="" class="size">LANDING PAGE - Other</option>
    <option value="" class="size">EVENTS - Brochure</option>
    <option value="" class="size">EVENTS - Signage</option>
    <option value="" class="size">EVENTS - Other</option>
    <option value="print" class="size bleed">ADS - Print Ad</option>
    <option value="" class="size">ADS - Digital Ads for Corporate</option>
    <option value="" class="size">ADS - Digital Ads for Clients</option>
    <option value="" class="size">COLLATERAL - Sell Sheet</option>
    <option value="" class="size">COLLATERAL - Case Study</option>
    <option value="" class="size">COLLATERAL - Brochure/Booklet</option>
    <option value="" class="size">COLLATERAL - E-Book</option>
    <option value="">WEBSITES - Copy change</option>
    <option value="">WEBSITES - Add Press Release</option>
    <option value="">WEBSITES - Upload a document</option>
    <option value="" class="size">WEBSITES - Imagery change</option>
    <option value="">WEBSITES - New page(s)</option>
    <option value="">WEBSITES - Brand new website</option>
    <option value="">WEBSITES - Report an issue</option>
    <option value="">CULTURE -Shirt Design</option>
    <option value="">GENERAL QUESTION</option>  <!--this should NOT send email-to-case -->
    <option value="" class="size">Random/Miscellaneous graphic</option>
    <option value="">OTHER</option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
  </select>
  <br/>


  <div class="always"> Priority Level?
    <label for="priorityurgent">Urgent</label>
    <input type="radio" id="priorityurgent" name="priority" value="urgent" >
    <label for="priorityqueue">Put in queue</label>
    <input type="radio" id="priorityqueue" name="priority" value="queue" checked >
    </div>
  <div class="always">Due Date: <input type="text" id="datepicker" placeholder="Click to pop-up calendar">
  </div>
  <div class="always"> Enter any additional information about timing<br>
  <textarea rows="4" cols="50" placeholder="Enter additional info regarding timing..."></textarea>
  </div>
  <div class="size"> Size (w x h):
    <input type="text" id="size" name="size" placeholder="WxH" required />
  </div>

Answer 1

您的typeChosen已经分配了该活动，因此您的function typeChosen(thisObj) { $(".always").show(); if( $(thisObj).find('option:selected').hasClass("size") ) $('div.size').show(); else $('div.size').hide(); } $(document).ready(function () { $("#typeofrequest").change(function () { typeChosen(this); }); $( "#datepicker" ).datepicker(); });不需要

{{1}}

为什么两个Jquery行都不会执行？

1 个答案: