0

jQuery UI.Dialog を使用しています。リンクをクリックしてダイアログ ボックスを表示すると、#Test のテキストが消え、モーダル オーバーレイが表示されますが、実際のモーダル ボックスは表示されません。

FireBug を使用すると、ダイアログ ボックスが作成されますが、Display:None があるため、表示されません。また、firebug でこれを Display:Block に変更すると、ダイアログが表示されますが、ページの左側にあります... 何か提案はありますか?

私のコードは非常に単純です:

<head>
<link href="Vader/jquery-ui-1.7.1.custom.css" rel="stylesheet" type="text/css">
<script src="javascripts/jquery.js" type="text/javascript"></script>
<script src="javascripts/ui.core.js" type="text/javascript"></script>
<script src="javascripts/ui.draggable.js" type="text/javascript"></script>
<script src="javascripts/ui.resizable.js" type="text/javascript"></script>              
<script src="javascripts/ui.dialog.js" type="text/javascript"></script>     
    <script type='text/javascript'>
    $(function() {
        $("a").click(function(){
            $('#Test').css('display','inline');
            $("#Test").dialog({modal: true});
        });
    });
</script>
</head>
<body>
    <a href="#">Test</a>
    <div id="Test" title="Test Title">Bla bla bla</div>
</body>
4

4 に答える 4

3

クリックに追加したい場合がありますe.preventDefault（）; したがって、ページを更新する可能性のある＃をロードしようとはしません。 

    $("a").click(function(e){
        e.preventDefault();
        $('#Test').css('display','inline');
        $("#Test").dialog({modal: true});
    });
于 2009-03-27T06:11:10.997 に答える
0

cssファイルを取得していないのではないかと思いますが、実際に取得していることを確認しましたか?

私が知る限り、コードに問題はありません。次のテストは私のサンドボックスファイルで機能します

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!-- Above Doctype should provide S mode in Moz, Safari, Opera, IE8 and A (almost standards) in IE6/7 -->
<head>
  <meta http-equiv="Content-Type" content="application/text+html;utf-8"/>

  <title>Sandbox</title>
  <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("jquery", "1.3.2");
    google.load("jqueryui", "1.7.0");
</script>
<script type="text/javascript">

      $(document).ready(function() {
        $("a").click(function(){
            $('#Test').css('display','inline');
            $("#Test").dialog({modal: true});
        });


    });
</script>
</head>
<body>
    <div id="container">
        <a href="#">Test</a>
        <div id="Test" title="Test Title">Bla bla bla</div>
    </div>
</body>

</html>
于 2009-03-26T13:02:22.120 に答える
0

<A> はブロック レベルの構造体ではないため、問題が発生する可能性があります。

DIV でラップしてから、代わりにダイアログでその div を作成してください。

于 2009-03-26T13:04:19.293 に答える
0

同じ問題が発生し、CSS ファイルが見つからないことが判明しました。css ファイルをロードするには、firebug を使用します。Firebug に「404 Not found」が表示されることがあります。

于 2009-03-26T13:04:21.260 に答える