jQuery - 如果文本框和下拉列表均为空，则显示段落

Question

我想在文本框和下拉列表都为空时显示段落。我让他们分开工作，但不知道如何组合它们。

所以基本上，我想要下拉和文本框，只有一个段落，当两个其他领域都是空的时候会显示。

我走到这一步：

<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

Answer 1

我更新了你的小提琴这样既选择和文本显示和隐藏，如果他们用值填充根据段落。

$('#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>