1

ボタンがクリックされたときに（いくつかのサンプルコードから）jqueryダイアログを表示しようとしていますが、何らかの理由で表示されません。あなたが助けてくれることを願っています:

<html>      
<head>
    <script type="text/javascript" src="jquery.js"/>
    <script type="text/javascript">
        $(document).ready(function() {
            var $dialog = $('<div></div>')
                .html('This dialog will show every time!')
                .dialog({
                    autoOpen: true,
                    title: 'Pick A Time Period:'
                });

            $('#reports').click(function() {
                $dialog.dialog('open');
                // prevent the default action, e.g., following a link
                return false;
            });
        })
    </script>
</head>
<body>
    <button id="reports">Hi</button>
</body>
</html>

編集: 申し訳ありませんが、JQueryUI が別のファイルであることに気付きませんでした。今日はJQueryを学んでいるだけなので、すべてが初めてです

JQueryUIファイルに正しいスクリプト行を追加しましたが、何らかの理由でまだ機能していません:

<html>      
<head>
    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.21.custom.css" rel="Stylesheet" />   
    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            var $dialog = $('<div></div>')
                .html('This dialog will show every time!')
                .dialog({
                    autoOpen: true,
                    title: 'Pick A Time Period:'
                });

            $('#reports').click(function() {
                $dialog.dialog('open');
                // prevent the default action, e.g., following a link
                return false;
            });
        })
    </script>
</head>

<body>
    <button id="reports">Hi</button>
</body>
</html>
4

2 に答える 2

1

jquery ダイアログ スクリプトの直前に head タグの間にこの行を含めて、何が得られたかを確認してください。

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
于 2012-06-22T19:01:09.443 に答える
1

次のようにする必要があります。

<script type="text/javascript" src="jquery.js"></script>
于 2012-06-22T18:32:03.660 に答える