typeface.js - это не "переписывание" - PullRequest
0 голосов
/ 20 июля 2011

Как может получиться, что typeface.js не "переписывает", когда вы нажимаете новый href?

Если вы удаляете typeface-js из класса, это работает.

Прямая ссылка: http://temp.electrobeat.dk/typeface.php

Обновлена ​​функция:

            function generate_menu(page){
                var menu = {
                    posting : {
                        title : 'Posting'
                    },
                    account : {
                        title : 'Account'
                    }
                };

                var elm = $('#div_menu').empty();
                for(var key in menu){
                    (function(key){
                        $('<a class="typeface-js menu '+(key == page ? 'menu_active':'')+'" href="#'+key+'">'+menu[key].title+'</a>').appendTo(elm)
                            .click(function(){
                                generate_menu(key);
                            });
                    })(key);
                }
                _typeface_js.initialize();
            };

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js" type="text/javascript"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript"></script>

        <script src="typeface-0.15.js" type="text/javascript"></script>
        <script src="arial_bold.typeface.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                function generate_menu(page){
                    var menu = {
                        posting : {
                            title : 'Posting'
                        },
                        account : {
                            title : 'Account'
                        }
                    };

                    var elm = $('#div_menu').empty();
                    for(var key in menu){
                        (function(key){
                            $('<a class="typeface-js menu '+(key == page ? 'menu_active':'')+'" href="#'+key+'">'+menu[key].title+'</a>').appendTo(elm)
                                .click(function(){
                                    generate_menu(key);
                                });
                        })(key);
                    }
                };

                generate_menu('posting');
            });
        </script>

        <style type="text/css">
            #div_menu {
                background:#ff0000;
                padding:5px;
            }

            .menu {
                font-family:arial;
                font-size:14px;
                color:#e8f5ff;
                font-weight:bold;
                border-bottom:3px solid transparent;
                text-decoration:none;
                padding:1px 2px 2px 2px;
                margin:0px 2px 0px 2px;
            }

            .menu_active {
                color:#07447c;
                border-bottom:3px solid #e8f5ff;
            }
        </style>
    </head>

    <body>
        <div id="div_menu"></div>
    </body>
</html>

Ответы [ 3 ]

1 голос
/ 20 июля 2011

Проблема в том, что вы удаляете элементы, а затем добавляете их снова, но typeface.js запускается только один раз на странице.Если вы делаете это, вам нужно вручную перезапустить метод typeface.js, который может быть:

_typeface_js.initialize(); 

Поместите это (или какой бы метод он ни был) в ваш метод generate_menu после присоединения элементов.

1 голос
/ 20 марта 2012
0 голосов
/ 20 июля 2011

Вы должны отменить распространение события по умолчанию при нажатии на ссылку:

.click(function(event){
    event.preventDefault();
    generate_menu(key);
    return false;
});

Что происходит, так это то, что независимо от того, какой код выполняется при нажатии на ссылки меню, браузер переходит к их href, что означает "#".

...