目前,我一直停留在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>
当选择下拉值时,文本字段也应消失。