1

外部CSSファイルを使用している場合、jqueryダイアログはdialogClassによって定義されたCSSスタイルを適用しないことに気付きました。...または少なくとも私がやっている方法ではありません。フィドルの作成に進みましたが、そこで機能していることに気付き、CSS をページのヘッド セクションに移動しようとしたところ、機能しました。外部CSSファイルからスタイルを適用するjqueryダイアログを取得する方法はありますか、それともHTMLページのCSSにこだわっていますか? 以下のコードが機能する方法の解決策を提供してください（ダイアログオンフライのhtmlと、イニシャライザで提供されるダイアログオプションを使用）。

function test()
{
    var html = "<strong>Hello World!</strong>";
    var $dialog = $('<div></div>').html(html)
        .dialog({ dialogClass: 'myStyle', modal: true, autoOpen: false });

    $dialog.dialog('open');
}

.myStyle
{
    color: #FF0000;
    font-size: 28pt;
    font-family: 'Comic Sans MS';
}


<head>
<script type="text/javascript" src="myexternal.js"></script>
    <link type="text/css" href="core.css" rel="Stylesheet" />
    <link type="text/css" href="lib/jquery-ui-1.8.19.custom/css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="Stylesheet" />   
    <script type="text/javascript" src="lib/jquery-ui-1.8.19.custom/js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="lib/jquery-ui-1.8.19.custom/js/jquery-ui-1.8.19.custom.min.js"></script>
</head>
<body>
    <form id="form2" >
        <div>
            <input id="Button2" type="button" value="Show Dialog" onclick="test();" />
        </div>
    </form>
</body>
4

1 に答える 1

0

笑問題は、あなたの頭の中のレイアウトです。あなた自身のコアリンクの前にjQueryUI cssリンクを置いてください。このように、jQueryUI.css が最初に適用され、次に css が適用され、遅れて変更が行われます。

また、同じ注意事項として、コア js が jquery を使用している場合は、ur ヘッダーの jquery リンクに従うことをお勧めします。独自の「追加機能」を追加する前に、必ず「コア ライブラリ」(別名 jQuery & jQueryUI) を追加してください。

于 2012-04-27T00:30:29.320 に答える