言語選択に基づいてタブを非表示にする

Question

言語を選択すると、他のタブ（ラベルとタブ自体）を非表示にしようとしています。 私は何が間違っているのか理解できませんが、私は違う時にコードを変えようとしましたが、私が得ることのできないものがあります。また、コンソールにエラーが表示されることもありません。 誰かが私を正しい方向に向けることができますか？

$(document).ready(function() { 
 
     showtabs(); 
 
     jQuery('#language').on('change', showtabs()); 
 
    
 
     function showtabs() { 
 
     jQuery('.tab_header a').show(); 
 
     jQuery('.tab_form_lang').show(); 
 
     var valueSelected = jQuery("#language option:selected").val(); 
 
     if (valueSelected != 0) { 
 
      jQuery('.tab_header').find('a').hide(); 
 
      jQuery('.tab_form_lang').hide(); 
 
      jQuery('a[langid=' + valueSelected + ']').show(); 
 
      jQuery('.tab_form_lang[langid=' + valueSelected + ']').show(); 
 
     } 
 
    } 
 
})

.tab_header a { 
 
    float: left; 
 
    width: auto; 
 
    height: 50px; 
 
    line-height: 50px; 
 
    padding-left: 15px; 
 
    padding-right: 15px; 
 
    color: #FFF; 
 
    font-size: 15px; 
 
    margin-right: 2px; 
 
    background-color: #788288; 
 
    text-transform: uppercase; 
 
} 
 
.tab_form.displaynone { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
 
<select class="form-control" default="0" request="0" initvalue="0" id="language" name="lingua" onchange="resetStepSelect(this.id)"> 
 
    <option selected="selected" value="0">ALL (default)</option> 
 
    <option value="1">Italian</option> 
 
    <option value="2">English</option> 
 
</select> 
 
<div class="tab_header col-sm-offset-2 nopadding_right col-sm-10"> 
 

 
    <a class="selected" langid="1" id="tab_lang_0" href="javascript:changeTab(0)" title="" data-original-title="Italian" style="display: block;">Italian</a> 
 

 
    <a langid="2" id="tab_lang_1" href="javascript:changeTab(1)" title="" data-original-title="English" style="display: none;">English</a> 
 

 
</div> 
 

 
<div langid="1" class="tab_form tab_form_lang col-sm-12" id="tab_form_0" style="display: block;"> 
 
    the content of the tab with langid=1 
 
</div> 
 

 
<div langid="2" class="tab_form tab_form_lang col-sm-12 displaynone" id="tab_form_1" style="display: block;"> 
 
    the content of the tab with langid=2 
 
</div>

Answer 1

変更この行：

jQuery('#language').on('change', showtabs()); 

へ：

jQuery('#language').on('change', showtabs); 

勧告

は。 `（showtabs、[変更]）に jQuery('a[langid="' + valueSelected + '"]')...

代わりjQuery('a[langid=' + valueSelected + ']')...