タグ付けされた質問 「jquery-ui」

ユーザーが特定の情報を入力する必要があるjQueryダイアログがあります。このフォームには、「続行」ボタンがあります。この「続行」ボタンを有効にするには、すべてのフィールドにコンテンツが含まれている必要があります。それ以外の場合は、無効のままになります。 フィールドのステータスが変更されるたびに呼び出される関数を作成しました。ただし、この機能からダイアログボタンを有効または無効にする方法がわかりません。私は何をすべきか？ おっと、私はこれらのボタンが次のように作成されたことを言及するのを忘れていました： $(function() { $("#dialog").dialog({ bgiframe: true, height: 'auto', width: 700, show: 'clip', hide: 'clip', modal: true, buttons: { 'Add to request list': function() { $(this).dialog('close'); $('form').submit(); }, 'Cancel': function() { $(this).dialog('close'); } } }) });

237 jquery  jquery-ui 

私はjQueryとjQuery-uiを使用しており、さまざまなオブジェクトのさまざまな属性をアニメーション化したいと考えています。 ここで問題を説明するために、ユーザーがマウスを重ねると青から赤に変わる1つのdivに簡略化しました。 を使用するときに必要な動作を取得できますがanimate()、その場合、アニメーション化するスタイルはアニメーションコード内にある必要があり、スタイルシートとは別のものにする必要があります。（見る例1を） 別の方法を使用addClass()しremoveClass()ていますが、で取得できる正確な動作を再現できませんでしたanimate()。（例2を参照）） 例1 私が持っているコードを見てみましょうanimate()： $('#someDiv') .mouseover(function(){ $(this).stop().animate( {backgroundColor:'blue'}, {duration:500}); }) .mouseout(function(){ $(this).stop().animate( {backgroundColor:'red'}, {duration:500}); }); それは私が探しているすべての行動を表示します： 赤と青の間をスムーズにアニメーション化します。 ユーザーがマウスをdivの内外にすばやく移動しても、アニメーションは「オーバーキュー」しません。 アニメーションの再生中にユーザーがマウスを出し入れすると、現在の「途中」状態と新しい「目標」状態の間で正しく緩和されます。 ただし、スタイルの変更はで定義されanimate()ているので、そこでスタイル値を変更する必要があり、スタイルシートをポイントすることはできません。スタイルが定義されている場所のこの「断片化」は、本当に私を悩ませるものです。 例2 addClass()and を使用した私の現在の最善の試みはremoveClass次のとおりです（アニメーションを機能させるには、jQuery-uiが必要です）。 //assume classes 'red' and 'blue' are defined $('#someDiv') .addClass('blue') .mouseover(function(){ $(this).stop(true,false).removeAttr('style').addClass('red', {duration:500}); }) .mouseout(function(){ $(this).stop(true,false).removeAttr('style').removeClass('red', {duration:500}); }); これは、元の要件のプロパティ1と2の両方を示していますが、3は機能しません。 私はこれの理由を理解しています： アニメーション化するときaddClass()、removeClass()jQueryは一時的なスタイルを要素に追加し、提供されたクラスの値に達するまで適切な値をインクリメントします。その後、実際にクラスを追加/削除します。 このため、スタイル属性を削除する必要があります。そうしないと、アニメーションが途中で停止した場合、スタイル属性が残り、タグのスタイル属性がクラススタイルよりも重要であるため、クラス値が永久に上書きされます。 ただし、アニメーションの途中で新しいクラスが追加されていないため、このソリューションでは、アニメーションが完了する前にユーザーがマウスを動かすと、色が前の色にジャンプします。 私が理想的に望んでいるのは、次のようなことができるようになることです。 $('#someDiv') .mouseover(function(){ …

226 javascript  jquery  css  jquery-ui  jquery-animate 

に変更があったかどうかをキャプチャし<textarea>ます。文字の入力（削除、バックスペース）またはマウスのクリックアンドペーストまたはカットと同様です。これらすべてのイベントをトリガーできるjQueryイベントはありますか？ 変更イベントを試しましたが、コンポーネントからタブアウトした後でのみコールバックがトリガーされます。 使用：に<textarea>テキストが含まれている場合にボタンを有効にしたい。

219 javascript  jquery  jquery-ui 

現在のところ、この質問はQ＆A形式には適していません。私たちは回答が事実、参考文献、または専門知識によってサポートされることを期待しますが、この質問はおそらく議論、議論、投票、または拡張された議論を誘います。この質問を改善でき、再開できると思われる場合は、ヘルプセンターにアクセスしてください。 7年前休業。 基本的なページの機能強化のためにjQuery UIを使用しています。ボタンと入力のスタイルとモーダルダイアログボックス。今、Bootstrapに出会いました。 jQuery UIからBootstrapに移行した経験はありますか？これは私がやろうとしていることですが、これを行う前に、私が直面する可能性のある問題を認識したいと思います。

214 javascript  jquery  jquery-ui  twitter-bootstrap 

jQueryまたはjQuery-UIには、特定のドキュメント要素のテキスト選択を無効にする機能がありますか？

198 javascript  jquery  jquery-ui 

初めてjQuery DatePickerコントロールを使用します。私のフォームでは機能していますが、私が望むサイズの約2倍、jQuery UIページのデモの約1.5倍です。サイズを制御するために欠けている簡単な設定はありますか？ 編集：手がかりを見つけましたが、それは新しい問題を切り開きます。CSSファイルでは、コンポーネントが親要素のフォントサイズに従って拡大縮小することを示しています。彼らは設定をお勧めします body {font-size: 62.5%;} 1em = 10pxにします。これを行うと、適切なサイズの日付ピッカーが得られますが、明らかに、サイトの残りの部分がめちゃくちゃになります（私は現在font-size：.9emを持っています）。 テキストボックスの周りにDIVを配置してフォントサイズを設定してみましたが、無視されているようです。だから、その親のフォントを変更して日付ピッカーを縮小する方法がいくつかあるはずですが、サイトの他の部分を台無しにせずにそれを行うにはどうすればよいですか？

195 jquery-ui 

予約日を選ぶのにデートピッカーを使っています。日付範囲を次の月のみに設定しました。それはうまくいきます。土曜日と日曜日を選択肢から除外したい。これはできますか？もしそうなら、どうですか？

193 javascript  jquery  jquery-ui  jquery-ui-datepicker 

input type="date"今回もFirefoxでまだサポートされていないのは奇妙です。実際、私はそれらがinput要素にHTML 5の新しいタイプの多く（もしあれば）を追加したとは思いません。IE10でサポートされていないのも当然です。だから、私の質問は... IEおよびFirefoxブラウザーのみのカレンダー/日付を取得するために、.jsファイル（つまり、DatePickerウィジェット）を追加せずに要素を機能type="date"させる方法は？FirefoxやIEブラウザでこの機能がデフォルトで機能するようにするために、どこかに適用できる何か（CDNか？）はありますか？IE 8以上のブラウザーとFirefoxをターゲットにすることは問題ではありませんが、最新バージョン（28.0）で問題ありません。inputjQueryUI 更新：Firefox 57以降は入力タイプ=日付をサポートしています

191 html  forms  jquery-ui  internet-explorer  firefox 

カスタムjQuery 1.10.3テーマを使用しています。テーマローラーからすべてのストレートをダウンロードしましたが、意図的に何も変更していません。 ダイアログボックスを作成すると、閉じるアイコンがあるはずの空の灰色の四角形が表示されます。 私は自分のページで生成されたコードを比較しました： <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"> <spanid="ui-id-2" class="ui-dialog-title">Title</span> <button class="ui-dialog-titlebar-close"></button> </div> ダイアログデモページで生成されたコードに： <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"> <span id="ui-id-1" class="ui-dialog-title">Basic dialog</span> <button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close"> <span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span> <span class="ui-button-text">close</span> </button> </div> 編集：コードのさまざまな部分は私ではなくjQueryUIによって生成されるので、通常の機能を実現するための悪い/不必要な選択のように見えるjqueryui jsファイルを編集せずにspanタグを追加することはできません。 コードのその部分を生成するために使用されるJavaScriptは次のとおりです。 this.element.dialog({ appendTo: "#summary_container", title: this.title(), …

188 javascript  jquery-ui  jquery-ui-dialog  imagebutton 

jquery-ui-dialogプラグインを使用しています ダイアログが閉じている状況でページを更新する方法を探しています。 ダイアログからcloseイベントをキャプチャする方法はありますか？ 閉じるボタンがクリックされたときにコードを実行できることはわかっていますが、ユーザーがエスケープで閉じることや右上隅のxをカバーしていません。

186 javascript  jquery  jquery-ui  modal-dialog  jquery-ui-dialog 

以前はJQuery UIのダイアログを使用していましたopenが、ダイアログが開かれたときに実行するJavascriptコードを指定できるオプションがありました。私はそのオプションを使用して、私が持っている関数を使用してダイアログ内のテキストを選択しました。 今、私はブートストラップのモーダルを使用してそれをしたいです。以下はHTMlコードです。 <div id="code" class="modal hide fade"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3>Modal header</h3> </div> <div class="modal-body"> <pre> print 'Hello World' そして、モーダルを開くボタンについては： <a href="#code" data-toggle="modal" class="btn code-dialog">Display code</a> ボタンのonclickリスナーを使用しようとしましたが、モーダルが表示される前に警告メッセージが表示されました。 $( ".code-dialog" ).click(function(){ alert("I want this to appear after the modal has opened!"); });

179 javascript  jquery  jquery-ui  twitter-bootstrap  modal-dialog 

私はjacksonを使用して、私のオブジェクトをjsonに変換しています。オブジェクトには2つのフィールドがあります。 @Entity public class City { @id Long id; String name; public String getName() { return name; } public void setName(String name){ this.name = name; } public Long getId() { return id; } public void setName(Long id){ this.id = id; } } これをjQueryのオートコンプリート機能で使用したいので、jsonでは「id」を「value」として表示し、「name」を「label」として表示します。ジャクソンのドキュメンテーションはこれについて明確ではなく、私は必要なことをするように遠く離れているように見えるすべての注釈を試しましたが、json としてname表示されlabelたりid、表示されたりすることはできませんvalue。 これを行う方法を知っている人はいますか？

169 java  jquery  hibernate  jquery-ui  jackson 

Twitterブートストラップモーダルウィンドウのアニメーションをスライドダウン効果からフェードインに変更する方法、またはスライドなしで表示する方法はありますか？私はここのドキュメントを読みました： http://getbootstrap.com/javascript/#modals ただし、モーダルボディのスライド効果を変更するためのオプションについては触れられていません。

167 javascript  jquery  jquery-ui  twitter-bootstrap 

私が使用しているjQueryのUIオートコンプリートのプラグインを。ドロップダウン結果で検索文字シーケンスを強調表示する方法はありますか？ たとえば、データとして「foo bar」があり、「foo」と入力すると、次のようにドロップダウンに「foo bar」が表示されます。

167 javascript  jquery  jquery-ui  jquery-ui-autocomplete 

ユーザーがリンクをクリックしたときに表示されるjQuery UIモーダルダイアログをセットアップしました。そのダイアログのdivタグには2つのテキストボックス（簡潔にするために1のコードのみを示しています）があり、フォーカスに反応するjQuery UI DatePickerテキストボックスに変更されています。 問題は、jQuery UI dialog（ 'open'）が何らかの方法で最初のテキストボックスをトリガーしてフォーカスを取得し、その後、日付ピッカーカレンダーをトリガーしてすぐに開くことです。 だから私はフォーカスが自動的に発生しないようにする方法を探しています。 <div><a id="lnkAddReservation" href="#">Add reservation</a></div> <div id="divNewReservation" style="display:none" title="Add reservation"> <table> <tr> <th><asp:Label AssociatedControlID="txtStartDate" runat="server" Text="Start date" /></th> <td> <asp:TextBox ID="txtStartDate" runat="server" CssClass="datepicker" /> </td> </tr> </table> <div> <asp:Button ID="btnAddReservation" runat="server" OnClick="btnAddReservation_Click" Text="Add reservation" /> </div> </div> <script type="text/javascript"> $(document).ready(function() { var …

156 javascript  jquery  jquery-ui