0

私は本を​​読んでjQueryを学んでいます（ちなみに非常に良い本です。）

チュートリアル 5 の演習を行うと、jQuery は常に、jquery-1.9.0 を使用して自動的に display:none に設定されることに気付きました。以前のバージョン (1.8.3 や 1.6.3 など) に変更すると、問題なく動作するようです。同じ問題が発生したかどうか疑問に思っていますか? バージョン 1.9.0 で解決しましたか?

以下は私のコードです。( http://sawmac.com/js2e/ Chapter 5/complete_faq.html )からダウンロードすることもできます。

<html>
<head>
    <meta charset="UTF-8">
    <title>A One Page Faq</title>
    <link href="../_css/site.css" rel="stylesheet">
    <style type="text/css">
        h2
        {
            background: url(../_images/open.png) no-repeat 0 11px;
            padding: 10px 0 0 25px;
            cursor: pointer;
        }

            h2.close
            {
                background-image: url(../_images/close.png);
            }

        .answer
        {
            margin-left: 25px;
        }
    </style>
    <script src="jquery-1.9.0.js"></script>

    <script>
        $(document).ready(function () {
            $('.answer').hide();
            $('.main h2').toggle(
                   function () {
                       $(this).next('.answer').slideDown();
                       $(this).addClass('close');
                   },
                   function () {
                       $(this).next('.answer').fadeOut();
                       $(this).removeClass('close');
                   }
               ); // end toggle
        }); // end ready
    </script>
</head>
<body>
    <div class="wrapper">
        <div class="header">
            <p class="logo">JavaScript <i>&</i> jQuery <i class="mm">The<br>
                Missing<br>
                Manual</i></p>
        </div>
        <div class="content">
            <div class="main">
                <h1>A One Page FAQ</h1>
                <h2>I've heard that JavaScript is the long-lost fountain of youth. Is this true?</h2>
                <div class="answer">
                    <p>Why, yes it is! Studies prove that learning JavaScript freshens the mind and extends life span by several hundred years. (Note: some scientists disagree with these claims.)</p>
                </div>
                <h2>Can JavaScript really solve all of my problems?</h2>
                <div class="answer">
                    <p>Why, yes it can! It's the most versatile programming language ever created and is trained to provide financial management advice, life-saving CPR, and even to take care of household pets.</p>
                </div>
                <h2>Is there nothing JavaScript <em>can&#8217;t</em> do?</h2>
                <div class="answer">
                    <p>Why, no there isn&#8217;t! It&#8217;s even able to write its own public relations-oriented Frequently Asked Questions pages. Now that&#8217;s one smart programming language!</p>
                </div>
            </div>
            <div class="footer">
                <p>JavaScript &amp; jQuery: The Missing Manual, by <a href="http://sawmac.com/">David McFarland</a>. Published by <a href="http://oreilly.com/">O'Reilly Media, Inc</a>.</p>
            </div>
        </div>
        </div>
</body>
</html>
4

2 に答える 2

2

この.toggle()関数は jQuery 1.8 で廃止され、jQuery 1.9 で削除されました。

.toggle(関数、関数、...) 削除

これは、「要素をクリックして指定した機能を実行する」という.toggle(). .toggle()非推奨ではない「要素の可視性の変更」と混同しないでください。前者は、混乱を減らし、ライブラリのモジュール化の可能性を高めるために削除されています。jQuery Migrate プラグインを使用して機能を復元できます。

ただし、使用を完全に停止した方がよいでしょう。

于 2013-02-16T13:30:19.977 に答える
0

Alexander言及された他の回答として、それ.toggle()は削除されましjQuery version 1.9.0+たが、それを使用migrate pluginすると確実に機能します。

使用する場合は、この移行プラグイン スクリプトを jQuery の下に追加しますjQuery 1.9.0+。

<script src="jquery-1.9.0.js"></script>
<script src='http://code.jquery.com/jquery-migrate-1.1.0.min.js'></script>
于 2013-02-16T13:37:48.747 に答える