かずきのBlog@hatena

すきな言語は C# + XAML の組み合わせ。Azure Functions も好き。最近は Go 言語勉強中。日本マイクロソフトで働いていますが、ここに書いていることは個人的なメモなので会社の公式見解ではありません。

NuGetでjQuery UIを入れる時の注意点

jQuery

前回の記事でjQuery UIを入れてウハウハしてました。ただ、コメントで指摘があるようにjQueryのバージョンが最新ではなかったようです。jQueryの公式サイトで確認すると現時点での最新バージョンは1.7.1です。前回の記事では1.4.4を使ってたので古いのもいいところといった感じでした。
別途NuGetからjQueryをインストールすることでjQuery 1.7.1が入ってきました。めでたしめでたし。

ということで、NuGetを使ってjQuery UIを入れるときには、きちんとjQueryのほうもインストールしましょうということでした！メモメモ。

因みに昨日のコードは、jQuery1.7.1に更新しても動きました！！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery-ui-1.8.16.min.js" type="text/javascript"></script>
    <link href="Content/themes/base/minified/jquery.ui.all.min.css" rel="stylesheet"
        type="text/css" />
    <script type="text/javascript">
        $(function () {
            $("#tabhost").tabs();
            // idがnaviのタグの下にあるh4のクリックイベントで
            $("#navi > h4").click(function () {
                // h4タグの次の要素を展開/折畳みをする
                $(this).next().slideToggle("slow");
            });
        });
    </script>
    <title></title>
</head>
<body>
    <div id="tabhost">
        <!-- タブのタグ？の部分 -->
        <ul>
            <li><a href="#tab1">タブ１</a></li>
            <li><a href="#tab2">タブ２</a></li>
            <li><a href="#tab3">タブ３</a></li>
        </ul>
        <div id="tab1">
            <div id="navi">
                <h4>
                    学ぶ</h4>
                <ul>
                    <li>初級</li>
                    <li>中級</li>
                    <li>上級</li>
                </ul>
                <h4>
                    学ばない！</h4>
                <ul>
                    <li>ほげほげ</li>
                    <li>ふー</li>
                    <li>ヴぁー</li>
                </ul>
            </div>
        </div>
        <div id="tab2">
            <p>
                タブ２のコンテンツをここに書く</p>
        </div>
        <div id="tab3">
            <p>
                タブ３のコンテンツをここに書く</p>
        </div>
    </div>
</body>
</html>

それにしても、Visual StudioのHTMLのエディタのコードフォーマットは、もうすこし賢くなってくれてもいいような気がする今日この頃でした。