顯示不同的結果，如果沒有在jQuery中找到ID

Question

我有一個選擇菜單和一些div關聯它。我希望選擇菜單根據選擇菜單值隱藏/顯示div。但是，如果jQuery沒有找到關聯div，那麼它應該提醒一些文本。

這裏是我的代碼：

$('select').change(function(){ 
 
    var div = $(this).val(); 
 
    $('#results div').hide(); 
 
    $('#' + div).show(); 
 
});

#results div { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option value="div_1">Div 1</option> 
 
    <option value="div_2">Div 2</option> 
 
    <option value="div_3">Div 3</option> 
 
</select> 
 

 
<div id="results"> 
 
    <div id="div_1">Div 1</div> 
 
    <div id="div_2">Div 2</div> 
 
</div>

正如你可以在我的例子中看到上面有沒有DIV 3所以我想警告說，沒有發現DIV 3。

任何讚賞怎樣的幫助:) jQuery對象的

Answer 1

使用length檢查比賽

$('select').change(function() { 
     var $div = $('#' + $(this).val()).show(); 
     if ($div.length) { 
     $('#results div').not($div).hide();    
     } else { 
     alert('No Match') 
     }  
}); 

我個人認爲這是一個糟糕的用戶體驗和更好的方法是刪除或禁用沒有匹配的<option>。

$('option').filter(function(){ 
    return !$('#' + this.value).length; 
}).remove()// or prop('disabled', true); 

Answer 2

檢查這個fiddle

$('select').change(function(){ 
    var div = $(this).val(); 
    $('#results div').hide(); 
    if($('#results').find('#' + div).length > 0){ 
     $('#' + div).show(); 
    } else{ 
     alert("not find") 
    } 
});