jQuery UI Datepicker：今日も選択されているときに強調表示しない

私はjQuery datepickerを使って日付を選択しています。私は変更したい1つのデフォルトの動作があることを除いて、うまく動作します。 1日を選択すると、選択した日が強調表示されます（これは好きです）。現在の日も強調表示されますが、別のCSSスタイルを使用します（私も好きです）。ただし、現在の日を選択すると、現在の日が選択されているためハイライト表示されます...現在の日のハイライトに優先するように選択されていますが、選択したことが非常に明確に感じられます現在の日。jQuery UI Datepicker：今日も選択されているときに強調表示しない

今、私はおそらく私の問題を解決するためにCSSを更新することができたと思う。しかし、後で私のアプリにスキンを追加したいので、私は本当の意味でのjQuery UI cssを調整したくありません。これは、jQuery UIのテーマをたくさん集めた場合、それらのすべてを同じように調整する必要がある（非常に好ましくない）ことを意味します。

これも実際のDatepickerプラグインを更新しても問題ありませんが、後でDatePickerを更新したい場合はこの問題にぶつかります。この修正をもう一度行う必要があります。

理想的には、私は目標を達成するためにDatepickerに組み込まれたオプションを使用することができますが、オプションのどれも正しいとは思われません。私はJavaScriptのハックのいくつかの種類の解決、またはCSSがページにプッシュしましたが、私は今考えを失っています。

出典

2009-04-08 Mike Stone

あなたのページに追加のCSSファイルを追加するのが望ましい方法です。それは簡単に管理され、使用されるようにCSSが使用されています！

オーバーライドCSSを以前にロードしたベースjQuery CSSまたはテーマCSSファイルの後にheadタグに配置して、その値を上書きする必要があります。（また、あなたの特定のインスタンス内のクラスやIDを参照し、デフォルトのタグの特異性を高めることができる。）

すなわち

<head> 
    <link href="base_jquery_css_file" rel="stylesheet"/> 
    <link href="theme_jquery_css_file" rel="stylesheet"/> 

    <link href="your_override_css" rel="stylesheet"/> 
</head>

「your_override_css」ファイルは、単純に含まれます

.ui-state-active, .ui-widget-content .ui-state-active { 
    /*any CSS styles you want overriden i.e.*/ 
    border: 1px solid #999999; 
    background-color: #EEEEEE; 
}

マイクから

注：

私は、日を表すアンカーの周りにtdがあり、tdも "今日の"情報を持っていることを知りました。複数のクラスを持つ項目を選択するクロスブラウザーの方法ではないにもかかわらずそれはまさに「選択を複製する方法を見つけ出すために私にしばらく時間がかかったので

.ui-datepicker-today .ui-state-active { 
    border: 1px solid #aaaaaa; 
}

出典

2009-04-08 18:24:16

これは完全に機能しているように見えます。ありがとう！ –

本当ですか？これは、今日は強調表示されていない現在の選択肢が強調表示されているという質問には答えません。他の授業があるので、バックグラウンドは重要でも変わっていないようです。また、私は選択されていないスタイルが何であるか分かりません。 –

を：（私が見つけたこと）、以下はPHPexperts.caが説明と同じように、新しいファイルには、このケースで動作します"スタイルは、PHPexperts.caからの回答であっても、今日のスタイルを上回っています。問題が発生した場合は、さらに簡単な情報になります。

あなたは「今日」以外の日を選択した場合は、「今日」を選択したときに、同じ外観のためにコピーする必要がありスタイルがaタグにし、セレクタに

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active

これですFirebugをインストールしてFirefoxをインストールしている場合（日付を選択し、日付ピッカーを再度開き、右クリックして「要素を検査」を選択すると簡単に見つけることができます）あなたがテーマを変更した場合、これらのスタイルのすべての3が変更のよう

のjQuery UIテーマ「UIの闇」のオーバーライドのCSSにコピーするスタイルが

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background:url("images/ui-bg_inset-soft_30_f58400_1x100.png") repeat-x scroll 50% 50% #F58400; border:1px solid #FFAF0F; color:#FFFFFF; }

で、それが見えます。

出典

2010-08-17 20:28:06

実際には、かなり簡単です。を背景と境界要素の.ui-state-activeクラスに追加するだけです。

出典

2011-12-19 18:09:01 Vince

.ui-state-highlight { 
    border: 1px solid #d3d3d3 !important; 
    background-color: #e6e6e6 !important; 
}

出典

2017-09-18 23:02:53 raminjacobson

jQuery UI Datepicker：今日も選択されているときに強調表示しない

答えて

関連する問題