href link 在我添加 javascript 后不起作用

href link doesn't work after I added javascript

我有一个简单的下拉列表,我想将其用作语言选择器, html 代码工作正常,但是当我在下面添加脚本时,href 不再工作。 当鼠标悬停时,我可以看到 link 但点击不起作用 !!!!

这是我的代码:

<body>
        <div class="container">



            <section class="main">
                <div class="wrapper-demo">
                    <div id="dd" class="wrapper-dropdown-2">
                        <span>Deutsch</span>
                        <ul class="dropdown">
                            <li><a href="http://www.bourax.com"><img src="./images/flags/flags_iso/32/de.png" >Deutsch</a></li>
                            <li><a href="#"><img src="./images/flags/flags_iso/32/en.png" >English</a></li>

                        </ul>
                    </div>
                ​</div>
            </section>

        </div>
        <!-- jQuery if needed -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript">

            function DropDown(el) {
                this.dd = el;
                this.placeholder = this.dd.children('span');
                this.opts = this.dd.find('ul.dropdown > li');
                this.val = '';
                this.index = -1;
                this.initEvents();
            }
            DropDown.prototype = {
                initEvents : function() {
                    var obj = this;

                    obj.dd.on('click', function(event){
                        $(this).toggleClass('active');
                        return false;
                    });

                    obj.opts.on('click',function(){
                        var opt = $(this);
                        obj.val = opt.text();
                        obj.index = opt.index();
                        obj.placeholder.text(obj.val);
                    });
                },
                getValue : function() {
                    return this.val;
                },
                getIndex : function() {
                    return this.index;
                }
            }

            $(function() {

                var dd = new DropDown( $('#dd') );

                $(document).click(function() {
                    // all dropdowns
                    $('.wrapper-dropdown-3').removeClass('active');
                });

            });

        </script>
    </body>

JSFiddle

这是由第一个点击处理程序中的 return false; 语句引起的。它阻止事件执行它应该执行的操作(很像使用 jQuery 时的 event.preventDefault();)。

尝试删除它,像这样:

obj.dd.on('click', function(event) {
  $(this).toggleClass('active');
  //return false;
});