2017-03-02 4 views
0

Ich möchte einen Absatz anzeigen, wenn sowohl das Textfeld als auch das Dropdownfeld leer sind. Ich habe sie getrennt arbeiten, aber nicht wissen, wie man sie kombiniert.jQuery - Absatz anzeigen, wenn Textbox und Dropdown beide leer sind

Also im Grunde, ich möchte das Dropdown und Textfeld und nur einen Absatz, der angezeigt wird, wenn beide anderen Felder leer sind.

Was ich so weit gekommen:

<label>Place of birth</label> 
<select id="placeOfBirth"> 
    <option value=""></option> 
    <option value="01">City 1</option> 
    <option value="02">City 2</option> 
    <option value="03">City 3</option> 
</select> 
<p class="show_dd"> show this if dropdown is not selected </p> <br><br> 

<label>Other</label> 
<input id="other"><br> 
<p class="show_text"> show this if field is empty </p> <br><br> 


$('#placeOfBirth').change(function() { 
    if($("#placeOfBirth").val()===""){ 
     $('.show_dd').show(); 
    } else { 
     $('.show_dd').hide(); 
    } 
}); 

$('#other').keyup(function() { 
    if ($('#other').val().length == 0) { 
     $('.show_text').show(); 
     $('#test').val($('#other').val()); 
    } else { 
     $('.show_text').hide(); 
    } 
}).keyup(); 

JSFIDDLE

+0

So etwas wie [das] (https://jsfiddle.net/pandeyvishal1986/L6xw6jyn/#&togetherjs=QtnoRgCKH9) – RonyLoud

Antwort

0

ich Ihre Geige aktualisiert, so dass beide wählen und Textbox auszublenden und den Absatz zeigen, basierend auf, wenn sie mit Werten gefüllt sind.

$('#placeOfBirth').change(hideParagraph); 
 
$('#other').keyup(hideParagraph).keyup(); 
 

 
function hideParagraph() { 
 
    if ($('#other').val().length == 0 && $("#placeOfBirth").val() === "") { 
 
    $('.show_text').show(); 
 
    } else { 
 
    $('.show_text').hide(); 
 
    } 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<label>Place of birth</label> 
 
<select id="placeOfBirth"> 
 
    <option value=""></option> 
 
    <option value="01">City 1</option> 
 
    <option value="02">City 2</option> 
 
    <option value="03">City 3</option> 
 
</select> 
 

 
<label>Other</label> 
 
<input id="other"><br> 
 
<p class="show_text"> Show this if one field is populated </p> <br><br>

Verwandte Themen