根据语言选择隐藏选项卡

时间:2017-01-21 19:06:20

标签: javascript jquery

当我选择语言时,我试图隐藏其他标签(标签和标签本身)。 我无法理解我做错了什么,我试图改变代码的不同时间,但有些东西我无法得到。它也没有在控制台中给我任何错误。 有人能指出我正确的方向吗?



$(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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

更改此行:

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

到:

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

推荐

尝试使用 jQuery('a[langid="' + valueSelected + '"]')...

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