Jquery x.event.dispatch撤消addClass / removeClass效果

时间:2014-10-06 14:31:44

标签: javascript jquery html css

我在网站上有三个标志图像作为语言选择器。在当前选择的语言中,我有一个灰色边框。

HTML:

<div class="widget widget_lang_widget" id="lang_widget-2">
 <ul>
   <li class="active" id="lang-Italian">
      <a href="#">
         <img alt="Italian" src="http://s14.postimg.org/44zy6qvz1/Italian.gif">
      </a>
   </li>
   <li id="lang-English">
      <a href="#">
        <img alt="English" src="http://s14.postimg.org/mw1vgwqjh/English.gif">
      </a>
   </li>
   <li id="lang-Spanish">
      <a href="#">
        <img  alt="Spanish" src="http://s14.postimg.org/4vsociycd/Spanish.gif">
      </a>
   </li>
 </ul>
</div>

CSS:

#lang_widget-2 {list-style: none !important ;}
#lang_widget-2 ul {list-style: none !important ; margin-left:0 !important; margin-right:10px;}
#lang_widget-2 ul li {padding:8px 0px;}

#lang_widget-2 ul li { float: left; margin:0;}
#lang_widget-2 ul li a{ text-indent:-9999px; margin:0; padding: 13px 5px 0 5px!important;}


#lang_widget-2 ul li a,#lang_widget-2 ul li a img{display: block;}
#lang_widget-2 ul li.active a img{border:solid grey; border-width:2px;}

当用户切换语言更新时,此边框将从之前选择的语言中删除并应用于新选择的语言。

为了做到这一点,使用jquery:

jQuery(document).ready(function($) {
        $('#lang_widget-2 ul li a').click(function() {
            $('#lang_widget-2 ul li.active').removeClass('active');
            $(this).closest('li').addClass('active');
        });
});

代码正常工作,但执行指令$(this).closest('li').addClass('active');后除外 调用的jQuery x.event.dispatch函数和我的javascript的效果都被撤消。

我做错了什么?

有人可以帮帮我吗?

0 个答案:

没有答案