Jquery prop required error

Question

ここに問題があります。

プロファンクション： 2つのオプションを設定する際に問題があります。 1つは動作し、1つは動作しません。 #additional_here_about_other_fieldの場合は .prop('required',true);が有効です。これにより、フィールドが必須に設定されます。同じ.prop('required',true);は#additional_who_is_your_orthodontist_fieldでは機能しません。私はこのフィールドも必要としたいが、うまくいかない。

jQuery(document).ready(function() { 
 
\t 
 
\t if(jQuery("#additional_here_about_other_field").length > 0){ 
 
\t \t jQuery("#additional_here_about_other_field").hide(); 
 
\t \t jQuery("#additional_how_did_u_hear_about_harp").change(function(){ 
 
\t \t \t if(jQuery(this).val() == 'Other (please specify)'){ jQuery("#additional_here_about_other_field").show().prop('required',true); } 
 
\t \t \t else { jQuery("#additional_here_about_other_field").hide(); } 
 
\t \t }); 
 
\t } 
 
\t if(jQuery("#additional_who_is_your_orthodontist_field").length > 0){ 
 
\t \t jQuery("#additional_who_is_your_orthodontist_field").hide(); 
 
\t \t jQuery("#additional_how_did_u_hear_about_harp").change(function(){ 
 
\t \t \t if(jQuery(this).val() == 'Orthodontist Referral'){ jQuery("#additional_who_is_your_orthodontist_field").show().prop('required',true); } 
 
\t \t \t else { jQuery("#additional_who_is_your_orthodontist_field").hide(); } 
 
\t \t }); 
 
\t } 
 
});

HTML snippet 

<select name="additional_how_did_u_hear_about_harp" id="additional_how_did_u_hear_about_harp" class="select " data-allow_clear="true" data-placeholder="How Did You Hear About The Harp?" > 
 
\t <option value="" selected='selected'></option> 
 
\t <option value="Patient" >Patient</option> 
 
\t <option value="Orthodontist Referral" >Orthodontist Referral</option> 
 
\t <option value="Trade Show" >Trade Show</option> 
 
\t <option value="Mailer" >Mailer</option> 
 
\t <option value="Other (please specify)" >Other (please specify)</option> 
 
</select> 
 

 
<div class="clear"></div> 
 
<p> \t \t 
 
\t <input type="text" class="input-text " name="additional_here_about_other_field" id="additional_here_about_other_field" placeholder="Other (please specify)" value="" /> 
 
</p> 
 
<div class="clear"></div> 
 
<p> \t \t 
 
\t <input type="text" class="input-text " name="additional_who_is_your_orthodontist" id="additional_who_is_your_orthodontist" placeholder="Who is your orthodontist?" value="" /> 
 
</p> 
 
<div class="clear"></div>

Answer 1

1. あなたの入力フィールドadditional_who_is_your_orthodontistでスペルミスを持っていますが、クエリadditional_who_is_your_orthodontist_field
言いました

$(document).ready(function() { 
 

 
    if ($("#additional_here_about_other_field").length > 0) { 
 
    $("#additional_here_about_other_field").hide(); 
 
    $("#additional_how_did_u_hear_about_harp").change(function() { 
 
     if ($(this).val() == 'Other (please specify)') { 
 
     $("#additional_here_about_other_field").show().prop('required', true); 
 
     } else { 
 
     $("#additional_here_about_other_field").hide(); 
 
     } 
 
    }); 
 
    }; 
 
    if ($("#additional_who_is_your_orthodontist").length > 0) { 
 
    $("#additional_who_is_your_orthodontist").hide(); 
 
    $("#additional_how_did_u_hear_about_harp").change(function() { 
 
     if ($(this).val() == 'Orthodontist Referral') { 
 
     $("#additional_who_is_your_orthodontist").show().attr('required', true); 
 
     } else { 
 
     $("#additional_who_is_your_orthodontist").hide(); 
 
     } 
 
    }); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="additional_how_did_u_hear_about_harp" id="additional_how_did_u_hear_about_harp" class="select " data-allow_clear="true" data-placeholder="How Did You Hear About The Harp?"> 
 
\t <option value="" selected='selected'></option> 
 
\t <option value="Patient" >Patient</option> 
 
\t <option value="Orthodontist Referral" >Orthodontist Referral</option> 
 
\t <option value="Trade Show" >Trade Show</option> 
 
\t <option value="Mailer" >Mailer</option> 
 
\t <option value="Other (please specify)" >Other (please specify)</option> 
 
</select> 
 

 
<div class="clear"></div> 
 
<p> 
 
    <input type="text" class="input-text" name="additional_here_about_other_field" id="additional_here_about_other_field" placeholder="Other (please specify)" value="" /> 
 
</p> 
 
<div class="clear"></div> 
 
<p> 
 
    <input type="text" class="input-text" name="additional_who_is_your_orthodontist" id="additional_who_is_your_orthodontist" placeholder="Who is your orthodontist?" value="" /> 
 
</p> 
 
<div class="clear"></div>