从 dropdwon 中选择时，为显示/隐藏文本框提供必填字段

Question

我必须提供显示/隐藏文本框必填字段.. 当用户从下拉文本框中选择其他时，将显示.. 我必须为该文本框提供必填字段.. 这是代码

 $("[name='mass']").change(function(){ if($(this).val() == "Other" ) { $('.other').slideDown(); $('.other').slideDown().find('.other').attr('required', true); } else { $('.other').slideUp(); $('.other').slideDown().find('.other').attr('required', false); } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select name="mass" id="types" class="col-md-12" required="required"> <option value="">Mass</option> <option value="Soul of">Soul of</option> <option value="Other">Others</option> </select> <div class="other" style="display:none;" > <label style="text-align:center;">If Others</label> <input type="text" name="other" id="other" placeholder="If Others" maxlength="30" class="col-md-12"></div>

Answer 1

在你的.find('.other')你正在寻找一个类，但输入有id="other"而不是class="other"

同样在您的else语句中，您正在使用slideUp和slideDown进行滑动，因此它将始终显示。

 $("[name='mass']").change(function() { if ($(this).val() == "Other") { $('.other').slideDown().find('#other').attr('required', true); } else { $('.other').slideUp().find('#other').attr('required', false); } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select name="mass" id="types" class="col-md-12" required="required"> <option value="">Mass</option> <option value="Soul of">Soul of</option> <option value="Other">Others</option> </select> <div class="other" style="display:none;"> <label style="text-align:center;">If Others</label> <input type="text" name="other" id="other" placeholder="If Others" maxlength="30" class="col-md-12"></div>