基于两个/三个下拉值的jQuery隐藏文本字段

时间:2018-08-06 08:42:06

标签: javascript jquery

目前,我一直停留在JQuery脚本上,我想根据两个/三个下拉值匹配使文本字段可见。以下是我的JQuery代码,当“状态”值“已解决”,“原因”值“ [任何]”,泄漏原因“ [任何]”以及原因值是“其他”描述文本字段时,我需要出现。如果以上任何更改值与当前条件都不匹配,则说明文本字段应消失。

$(function () {
  var changeVisibility = function () {
    var statusId = $('#issue_status_id').val();
    if (statusId >= '3') {


      var val2 =$("#issue_custom_field_values_18").val();
      if (val2 == '28' || val2 == '29' || val2 == '30' || val2 == '31' || val2 == '32' || 
      val2 == '33' || val2 == '34' || val2 == '35' || val2 == '36' || val2 == '89') {


       var val3 = $ ("#issue_custom_field_values_19").val();
       if (val3 == '37' || val3 == '38' || val3 == '39' || val3 == '40' || val3 == '41' ||
       val3 == '42' || val3 == '43' || val3 == '96') {

       var val = $('#issue_custom_field_values_26').val();

      if (val == '87') {
        $('#issue_custom_field_values_39').parent().show();
        $('.cf_39').show();
      } else if (val == '94') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      } else if (val == '81') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      } else if (val == '82') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      } else if (val == '83') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      } else if (val == '84') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      } else if (val == '85') {
        $('#issue_custom_field_values_39').parent().hide();
        $('.cf_39').hide();
      }
        else if (val == '86') {
          $('#issue_custom_field_values_39').parent().hide();
          $('.cf_39').hide();
          } else if (val == '87') {
            $('#issue_custom_field_values_39').parent().hide();
            $('.cf_39').hide();
      } else {}
    }
  }
  }
  };

  changeVisibility();

  $('#all_attributes').on('change', '#issue_custom_field_values_26 ', function (e) {
    changeVisibility();
  });

  var _replaceIssueFormWith = replaceIssueFormWith;
  replaceIssueFormWith = function (html) {

    _replaceIssueFormWith(html);

    changeVisibility();
  };

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="all_attributes" class="attributes">
<p><label for="issue_status_id">Status<span class="required"> *</span></label><select onchange="updateIssueFrom('/issues/172/edit.js', this)" name="issue[status_id]" id="issue_status_id"><option value="1">New</option>
<option value="2">In Progress</option>
<option selected="selected" value="3">Resolved</option>
<option value="4">Feedback</option>
<option value="5">Closed</option>
<option value="6">Rejected</option></select></p>

<p style="display: block;"><label for="issue_custom_field_values_18"><span>Reason</span> <span class="required">*</span></label><select name="issue[custom_field_values][18]" id="issue_custom_field_values_18" class="enumeration_cf"><option selected="selected" value="89">--- Please select ---</option>
<option value="28">4 A</option>
<option value="29">4 B</option>
<option value="30">4 C</option>
<option value="31">4 D</option>
<option value="32">4 E</option>
<option value="33">4 F</option>
<option value="35">4 G </option>
<option value="36">4 H</option>
<option value="34">4 I </option></select></p><p style="display: block;"><label for="issue_custom_field_values_19"><span>Reason of Leakage</span> <span class="required">*</span></label><select name="issue[custom_field_values][19]" id="issue_custom_field_values_19" class="enumeration_cf"><option selected="selected" value="96">--- Please select ---</option>
<option value="37">5 A</option>
<option value="38">5 B</option>
<option value="39">5 C</option>
<option value="40">5 D</option>
<option value="41">5 E</option>
<option value="43">5 F</option>
<option value="42">5 G</option></select></p>
<p style="display: block;"><label for="issue_custom_field_values_26"><span>Cause</span> <span class="required">*</span></label><select name="issue[custom_field_values][26]" id="issue_custom_field_values_26" class="enumeration_cf"><option selected="selected" value="94">--- Please select ---</option>
<option value="81">A </option>
<option value="82">B </option>
<option value="83">C </option>
<option value="84">D </option>
<option value="85">E </option>
<option value="86">F </option>
<option value="87">G Other </option>
<option value="118">H </option></select></p>
<p style="display: block;"><label for="issue_custom_field_values_39">Description<span class="required"> *</span></label><input name="issue[custom_field_values][39]" id="issue_custom_field_values_39" value="" class="string_cf" type="text"></p>
</div>

当选择下拉值时,文本字段也应消失。

0 个答案:

没有答案
相关问题