[jquery] タグが付いた質問

jQueryとは、ジョン・レシグによって開発された、JavaScriptのライブラリである。エレメントの指定がCSSセレクタと同様の記述で選択ができる。「$」を「jQuery」のエイリアスとして定義されており、関数の呼び出しを容易にしている。また、関数をチェーンさせることで、より柔軟な操作が可能となっている。

644 件の質問
絞り込み
並べ替え
タグ付けされた
0
1 回答
1,192 閲覧数

ファイル名を取得してサーブレットクラスに渡したい。

画面でテーブルに対して行をクリックし、黄色行になっている状態で「ファイル名取得ボタン」を押し、黄色行のファイル名をJavaのサーブレットクラスに渡したいと思います。テーブルに対して行をクリックし、黄色行にするとこまでできているのですが、ファイル名を取得してJavaのサーブレットクラスにファイル名を渡すコードをどう書くか分かりません。どう書けばよろしいでしょうか。 <!DOCTYPE ...
0
0 回答
71 閲覧数

wordpressでAjaxを使った絞り込み検索をしたい。

解決したいこと 参考にしたサイトはこちらです https://webfun-style.com/wordpress-custom-search/ これに全てを選択チェックボックスを用意しましたが、挙動がうまくいきません。 実装したいことは以下です。 全てを選択チェックボックスを用意し、それをチェックしたら全てチェックされ、且つ全てが表示された絞り込み検索を実装したい ...
0
2 回答
1万 閲覧数

テーブルに対して行選択するコードを書きたい

テーブルに対して行選択しているファイルをダウンロードボタンでダウンロードできるものを考えています。 まず行選択できるコードの書き方が分からなくて悩んでいます。行選択できるようにするにはどういったコードを追記すればよろしいでしょうか。 ソースは下記となります。 <!DOCTYPE html> <html lang="ja"> <head> &...
0
1 回答
3,165 閲覧数

Bootstrapのdatatables内におけるselectボックスにデータを挿入するには

JqueryとBootstrap、Javaで開発しています。 今回datatables内にセレクトボックスを設置しているんですが、データの入れ方がうまくわかりません。 わかるかたいましたら、ぜひご教授お願いいたします。 HTML部分のコード <table id="kategoriTanka" class="table table-bordered table-...
1
1 回答
310 閲覧数

jQueryの<script>内の記述とファイルの記述の違い

発生している問題 jQueryをhtmlファイルに<script>タブで記述する場合と jsファイルに別途記述する場合では、挙動に差があるのでしょうか? Bootstrapの練習のためにこちらのサンプルをRuby on Railsで試しに使ってみたのですが、 以下のjQueryをindex.html.erbに<script>タブで記述した場合は正常に動作しますが、 ...
0
0 回答
182 閲覧数

AdminLTE 要素の範囲外をクリックした際に、指定のクラスを外す方法

AdminLTE を使用しています。 AdminLTEの機能で、 <a href="#" data-toggle="control-sidebar"></a> をクリックすると、 <aside class="control-sidebar control-sidebar-light"> に自動で、 control-sidebar-openクラスが付与され、 (...
0
0 回答
218 閲覧数

jquery3.3.1でのモーダル画像にプラスマイナスボタンをつけて拡大縮小を行いたい

プログラミング初心者です。 モーダルの画像にプラスマイナスのボタンをつけて拡大縮小したいです。 調べたところviewer.jsなどのプラグインを導入するとできそうなのですがやり方がわかりません。 教えていただける方いましたら よろしくお願いいたします。 jquery3.3.1 [html] <div> <img class="img-thumbnail" ...
0
1 回答
2万 閲覧数

Uncaught TypeError: $(...).on is not a functionが出てしまう

test.jsの「.on('show.bs.modal', function (e)」箇所で以下のようなエラーが出ており、 モーダルは表示されるのですが、モーダルのタイトルが書き換わりません…。 onの使い方、bootstrapのモーダルの書き方がおかしいのでしょうか? test.js:2 Uncaught TypeError: $(...).on is not a function ...
1
0 回答
560 閲覧数

HTML5 + Bootstrap + IE11 + Windows7にて、フォーカスを当てた時の挙動がおかしい

HTML5、Bootstrapにてページを作成しています。 IE11でテキストフィールドにフォーカスを当てた際に、謎の事象が発生しました。 1.枠線の影が消える 2.テキストフィールドの左上にグレーの影が表示される この現象は下記の環境で発生しています。 ・Windows7 Professional SP1(32bit) ・IE 11.0.9600.18537 (更新バージョン 11....
0
1 回答
2,418 閲覧数

クリックイベントが発火しない

bootstrapのリストがクリックされたときにactiveをクラスに追加たいと考えているのですが、以下のコードではクリックイベントが発火しませんでした。どのようにすればクリックイベントを発火させることができるのでしょうか。 javascript $('.list-group .list-group-item').on('click', function(e){ ...
0
1 回答
244 閲覧数

チェックボックスを扱って時間を変更したい。

画面表示をしたときにデフォルトでは時間が9:00と表示され、 終了時刻のチェックボックスにチェックを入れたら22:00に切り替わり、チェックボックスを外したら21:00に切り替わるという実装をしたいと考えていますが上手くいきません。(画面表示をしたときにデフォルトでは時間が9:00というのはできてます。) どのように修正したらよろしいでしょうか。お願いいたします。 <!DOCTYPE ...
0
1 回答
3,419 閲覧数

要素を横一列で並べたい。

営業時間のラベルから二つ目の時間入力までの要素を画面が小さくなっても横一列にしたいと思っていますが上手くいきません。画面を小さくすると、ラベルと入力のテキストボックスが縦に並んでしまいます。どう修正したらいいのか教えていただいてもよろしいでしょうか。 【コード】 <!DOCTYPE html> <html lang="ja"> <head> ...
0
1 回答
1,402 閲覧数

Timepickerが機能しない。

画面に「Timepicker」の機能を実装中ですが上手くいきません。 入力ボックスに「11:00 PM」という表示はでているのですがボタンを押そうとしても何も機能していない形です。ボタンをクリックして時間を選べるようにするにはどう修正したらよろしいでしょうか。 以前から使っている「http://getbootstrap.com/getting-started/#download」...
1
3 回答
2,279 閲覧数

modal内の特定の要素の高さを取得したい

現在、modal.js の version3.3.6 を利用して、モーダル表示を行うページを作っています。 この画面にはボタンがあり、ボタンをクリックするとモーダルウィンドウが表示されます。 モーダルの中には<p>で包んだ文字列があり、知りたいのはこの要素の高さの取得法です。 現状、クリックイベントで takasa = $("p").height(); ...
0
1 回答
519 閲覧数

zabuto calendarでクリックイベントをjsonの値によって変えたい

bootstrap(+jQuery)で動く,zabuto calendarというプラグインがあります。 デフォルトでの動きは, (1)マンスリーカレンダー表示 (2)JSON形式のイベントデータがあると,該当日付に背景色を表示。クリッカブルになる。 (3)クリッカブル日付をクリックすると,モーダルウィンドウが降る。モーダルウィンドウ内には,JSONデータやHTMLを記述可能。...
1
1 回答
932 閲覧数

Javascript : クリックで追加したtab要素に切り替えさせる

ボタンをクリック後、フォームを挿入してさらにマルチ言語用にタブ切り替えを実装させたいのですが、うまく行きません。 なんとかしてクリック毎にidを振り当ててその要素にタブ切り替えのファンクションを振り当てたいです。 どんな些細な事でも構いませんのでどなたかご指摘を宜しくお願いいたします。 var totalField = 0; function addField(type) { ...
1
1 回答
90 閲覧数

フォームのラベルをinputタグの上に表示させるアニメーションを作りたいですがラベルの非表示の切り替え方がわかりません

フォームのラベルをフォーカスされたときにinputタグの上に表示させるアニメーションを作りたいですがラベルの非表示の切り替え方がわかりません 今のソースコードはこのようになってますが問題があります 1つはフォーカスしていないときでもラベルが非表示になっていないことです。どのようにすればうまく実装できるのかわかりませんでした 2つはラベルが2つありますが、2つとも同じ位置に行ってしまうことです。...
0
1 回答
839 閲覧数

fullcalendarの定期イベントdowの一部上書き(非表示)について。

fullcalendarのイベントについて行き詰っており質問です。 実現したいこと 国民の休日をgoogleから取得 スタッフの毎週の出勤日をカレンダーに表示[](eventSourcesにdowで実装)←ここまでは実装できています。 会社の公休日にスタッフの出勤日を表示しないようにしたい。(←ここで行き詰ってます。) fullcalendar 現状のコード <script src='...
0
0 回答
43 閲覧数

bxsliderを使ったニュースティッカーがWindowをLostすると停止してしまう

下記の codepen をローカルに持ってきて動かしてみました。 codepen 9-4-1 ニュースティッカー 想定通りうまく動くのですが、ひとつだけ想定外の動きをします。 それは codepen の window はフォーカスを外れても(例えばメモ帳を起動したりしても)そのままクルクルとニュースが更新されていくのですが、ローカルで動かしている方は window ...
1
2 回答
3,131 閲覧数

モーダルダイアログの子ウィンドウから親ウィンドウの関数を呼び出す方法

cakePHP2 + mysql + bootsrap3 でサイトを構築しています。 親ウィンドウから、入力ウィンドウとして子ウィンドウ①を開き、 必要なIDがなければ生成するための子ウィンドウ②を立ち上げてID登録をして 子ウィンドウ①に返す といった処理を組もうとしています。 その際に、どのようにすれば子ウィンドウ①から子ウィンドウ②に値を返せるかが わかりません。 お手数ですが、...
0
0 回答
43 閲覧数

jQueryのmodaal.jsで紐付けができない

aタグを使わずにbuttonでやると紐付けができないのですが、どなたかご教示いただけると嬉しいです。 <button class="js-modal" data-group="gallery" data-modaal-content-source="#content01">表示</button> <...
1
1 回答
4,044 閲覧数

jQueryプラグインの「slick」を利用しつつランダム表示させたい

slickを利用したカルーセルをランダムに表示するようしたいのですが、ランダム表示にはなっているものの、下記3点の不具合があり解決方法をご教授いただけますと幸いです。なお、カルーセルさせる画像の枚数は10点としています。 全10点の画像のうち1点が2回(どの画像になるかはその都度変わります)表示される (意図通りに)表示されない画像が1点ある 最後の画像(10枚目)から最初の画像(1枚目)...
0
0 回答
87 閲覧数

jquery draggableで複数のdivの中だけを移動する方法がわかりません

jquery uiのdraggableでbodyのdivの中だけをdrag出来るようにしたいです。 containmentを使うと良いみたいですが、 containment: '.body', にすると、一つの.bodyの中でしかdrag出来ません。 全部の.bodyの中、つまり.headerを除いた全体で移動がしたいのですが、方法がわかりません。 snipetで確認が出来ます。 ...
1
1 回答
91 閲覧数

jqueryでdivなどをdragしている最中にdrag対象の文字を変えてしまうとresize出来なくなってしまう

jqueryでdragしている間そのdivの内容の文字をtext()で変更すると resizeが出来なくなってしまうのです。 詳しくはsnipetで実行してみてください。 jqueryのtext()の代わりに.get(0).innerTextに変更しても同じ現象が発生します。 text()の代わりにhtml()にしても同じ現象が発生します。 変更した後にもう一度draggable()...
1
1 回答
1,555 閲覧数

IE9でローカルのファイルを読み込むことは可能ですか?

やりたいことは下記のようにファイル名をinput要素で指定してもらい、ボタンを押したらその内容を取得したいです。 csvファイルを読み込むことを想定しています。 IE10以降ではFileAPIが使えるのですが、IE9では動きません。 下記のように書けばできるかと思いましたが、このコードは動きませんでした。 すいません、制約を書いてませんでした。 ...
0
0 回答
575 閲覧数

rails7の「Turbo」と「link_to」と「jQuery」の相性悪くて困っています。

やりたいこと ・ユーザーの退会処理を実装したい。(is_deleted) 環境:Rails 7.0.5, ruby 3.1.2p20, AWS EC2で管理。 対象のソースコード <%= link_to "退会", users_hide_user_path(current_user), data: { turbo_method: :delete, ...
0
0 回答
87 閲覧数

Rails & jQuery 検証ツールエラーについて

非同期通信を実装したい Ruby on RailsとjQueryで「英単語クイズアプリ」の作成をしています。 ユーザーは出題された英単語の穴埋めを考えて英単語を完成させ、「text_filed_tag」に入力し、送信をクリックします。正解なら次の問題へ、不正解なら再度同じ問題を解く、というものです。 解決方法わかる方いらっしゃいましたら是非ご教授お願いします。 検証ツールで表示されるエラーです。 ...
0
1 回答
360 閲覧数

jQuery Datatables にAPIで取得したデータベースデータが表示できない。

問題点 ソースコード上、js/index.jsにハードコードしたdata変数では Datatablesに表示ができます。 しかし、APIで取得したデータtest_dataでは表示できません。 console.logで表示したデータは、ブラウザのデベロッパーツールの表示において、どちらのデータも以下のように同じ形式にしか見えませんでした。 Attray(5) 0:{id:1,name:'A'} ...
0
0 回答
101 閲覧数

入力した数値の単位を項目ごとに指定する方法

初めまして プログラミングを学んでいる者です。 どうやって実現すればいいかわからないので先輩方の力を借りたいです。 実現したいこと 各項目 A,B,C があって Aが追加されたら数値入力の単位を0.1ずつ増減できる Bが追加されたら数値入力の単位を0.5ずつ増減できる Cが追加されたら数値入力の単位を1.0ずつ増減できる というのを実現したいです。 HTML,Javascript,Jquery,...
0
1 回答
111 閲覧数

タブレットでChromeブラウザ でoption 要素が disabled しない

シンプルなOption要素でDisabledしたいのですが、タブレットでChromeから見るとDisabledされません。 <select name="fruits"> <option value="peach" disabled>peach</option> <option value="apple">apple</...
0
1 回答
1,364 閲覧数

PC版Safariにおいて背景画像が表示されない

PC版(Macでのみ確認)Safariにおいて、リンク要素にロールオーバーした際にbodyの背景画像を設定しているんですが表示されず、下記ページの方法を試したんですがそれでも解決されませんでした。 http://16deza.com/note/background-image-pcsafari-not-displayed/ 問題の起こっているサイトはこちらになります。 http://hyld....
0
1 回答
95 閲覧数

MonacaとOnsen UIで作成したアプリがメニュー切り替えすると表示されなくなる

【作成環境】 Monaca Onsen UI Javascript jQuery 【作りたいアプリ】 TOPページにカレンダーを表示したい 【今起きている問題】 読み込み時はカレンダーが表示されているが、メニュー切り替えするとカレンダーが表示されない。 【確認したこと】 ・リロードすると表示される ・呼び出したい関数の中に挿入したconsole....
0
1 回答
332 閲覧数

npmで取得したJavaScriptライブラリ (rollup.js) をHTMLから呼び出す方法

知りたいこと npmというものを使えばJavaScriptライブラリのバージョン管理ができると聞き少しずつ触って見ておりますが、どのようにしてhtmlからそのJavaScriptを呼び出せばいいのかがわからないので知りたいです。 npmはPHPでいうcomposer、Pythonで言うpip、nimでいうnimbleのようなものだと思っております。 ここも間違っていたらご指摘いただけると嬉しいです。...
0
1 回答
642 閲覧数

Laravel+jquery 一覧表示したデータのidをjsのコンソール側で取得できるようにしたい。

やりたいこと 最終目標としては、Ajaxを使って一覧表示の削除ボタンを押すと、非同期でUI上からもDBから削除するできる機能を目指しています。 その前段階として、jqueryのみでフロント側のみできる削除する機能を実装したいと考えています。 さらにこの機能を実装する手段として、まずはボタンをクリックするとjs側で、一覧リストそれぞれのidを取得する必要があるのですが、ここに苦戦しています。 問題点 ...
1
1 回答
81 閲覧数

要素Aの数字より要素Bの数字が小さい場合に、要素Cに判定を出したい

以下のような予算(class="budget")を費用(class="cost")が上回った場合に判定結果(class="result")に「予算オーバー」と表示したいですが上手くいきません。 ご教授のほどよろしくお願いいたします。 ▼HTML <div> <div><span class="...
0
1 回答
116 閲覧数

jQueryで*:contains('AAA')セレクタで要素を選択させた際に直近の要素のみを選択できるようにしたい

<table> <tr><td>AAA</td></tr> <tr><td>BBB</td></tr> </table> というHTMLがあったとして、 jQueryで $("*:contains('AAA')").addClass('hoge'); ...
1
0 回答
310 閲覧数

railsにratyを導入したいがエラーが出る

環境 ruby 3.1.2 rails 6.1.4 raty 4.1.0 解決したいこと Ruby on railsで本のレビューの投稿をできるようなページを作成しています。 ratyで星による評価を実装しようとしたところ、下記のエラーが出てしまいました。 raty.jsはhttps://github.com/wbotelhos/raty/blob/main/src/raty.js ...
0
1 回答
496 閲覧数

jQuery UI Sortable で移動範囲を指定したい

tableタグで作成した表内で、移動を制限したいと思っています。 表の最上部と最下部を「対象外(ハンドルなし)」にはできます。 しかし、他の要素を「最上部より上」「最下部より下」に移動できてしまいます。 この動きを抑制する方法はあるでしょうか? よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head&...
0
0 回答
408 閲覧数

vimeo+player.jsでサイトに埋め込みした動画の視聴時間を計測したいが同じデータがいくつも作成されてしまう

サイトにvimeoをiframeで埋め込み player.jsを利用して 再生(イベント発火⇨視聴開始した現在時刻を保存) 一時停止または動画終了(イベント発火⇨視聴終了した現在時刻を保存)」 [1]と[2]の差分をDBに保存 で視聴時間を登録しているのですが、なぜか同じデータが複数作成されるケースがあります。 ブラウザの問題の可能性も考え PC:Chrome・Safari iOS(15.7):...
0
1 回答
323 閲覧数

jQuery UIのSortableを用い、li要素並び替え後にも要素の情報を取得したい

現在Webaアプリケーションを作成しながらプログラミングの学習をしているものです。 jQueryのSortableを使用して、li要素の並び替えを行なっております。 下記のソースコードは、要素をドラッグして任意に並び替えた後、要素クリックでコンソールに、innerHTMLを出力するコードになります。 しかし、要素を並び替えた後、クリックすると違う要素の情報が取得されてしまいます。...
0
1 回答
1,239 閲覧数

ボタンを押すと画像がフェードイン・フェードアウトするという動作をしたい

ボタンを押すと画像がフェードイン・フェードアウトするという動作をしたいのですが、上手く繋げれていないみたいです。多分idが必要だと思うのですが、どう打ち込むのが正解でしょうか? 以下は現時点での状態です。 初心者のためまだまだ分からないことが多いですがよろしくお願い致します。
0
1 回答
940 閲覧数

jQueryにてdiv要素にキー入力を代行させる方法

やりたいこと 下記のdiv要素である"down"をクリックしている間は、下矢印キーを押し続けている扱いにする方法はないでしょうか? 試す限りでは押し続けている判定は、onmousedownを使えば出来そうですが、javascriptに「キー入力を代わりに入力させる」方法がわかりません。 <div class="down"> <h1&...
0
2 回答
471 閲覧数

jQueryを用いたスライダーでページナビゲーションごとスライドさせるにはどうしたらよいでしょうか。

jQueryを用いたスライダーでページナビゲーション(左右に表示されるものではなく、ページ下部にスライドさせるスライダーの枚数のリンクを表示したナビゲーションです)をスライド画像ごとスライドさせるにはどうしたらよいでしょうか。 良い案が見つからず悩んでいるのでご存知の方いらっしゃいましたらご教示いただきたいです。 スライダーはbxsliderを使用する想定ですが、...
0
1 回答
150 閲覧数

クリックした画像を変更したい

クリックした画像をコールバック関数とアニメーションを使って変更させたいです。 以下のコードだとリストの画像をクリックするとアニメーションは適用されているのですが、画像は初期値のsample1が表示され画像の変更ができないです。 どうすればクリックした画像に変更できるでしょうか? <body> <main> <h1>...
0
3 回答
289 閲覧数

jQueryを使って選択した画像を非同期処理で表示させたい

問題 画像を表示は出来た。 データとして、sqlのデータに保存ができていない。 確認で、抽出工程を確認すると画像を指定してあげるとできていた。 目標 laravelで画像を非同期処理でファイルから選択して表示させたい また、他ファイルでも表示できるようにする コメントアウトしてる方、してない方どちらも試しているが表示されない blade <div id="image"&...
0
1 回答
86 閲覧数

(this).scrollTop()の終了の仕方がわからない

普段、簡単なjQueryなどは使うのですが、複雑になるといつもつまづいてしまいます。 どなたか下記の動作を実現するにはどう作ればいいのか方法を教えていただきだいです。 やりたいこと ある高さまでスクロールしたら画像に追従用のclassを追加 上にスクロールして画像が元からあった場所まで戻ってきたら追従用のclassを外す 画像が追従中、画像をクリックしたら追加したclassを外す(...
0
0 回答
217 閲覧数

リンクのアドレスを取得したい

拡張機能を作成しようとしています。 リンクを右クリックし、コンテキストメニューに追加した新しい項目をクリックしたときに、リンクのアドレスを取得したいです。 現時点では、右クリックをしたらコンテキストメニューに項目が追加されるようにはなっているのですが、クリックしたリンクのアドレスを取得する方法が分かりません。わかる方いらしましたら、お手数をおかけしますがよろしくお願いします。 現時点でのコードです↓...
0
1 回答
246 閲覧数

jQueryとjQuery UI でアニメをさせたところ,何故か無限に繰り返してしまう

要約 jQueryとjQueryUIを用いて,マウスオーバーすると色が変わり,マウスアウトすると元に戻るアニメをつけようとしていたところ,.stop()の付け方によっては無限の繰り返しが発生してしまうことがわかりました.しかし,考えても原因がわかりません. マウスを動かしていないのにmouseoverイベントが繰り返し発生しているようなのですが,それはおかしなことだと思います. ...
0
1 回答
1,605 閲覧数

jQuery-Validation-Engine でエラー発生時の吹き出し表示をクリックしても消えないようにしたい

フォームのバリデーションにjQuery-Validation-Engineというプラグインを使用しています。 エラーがあるときに吹き出しが出て、その吹き出しをクリックすると消えます。 これをクリックしても消えないようにする方法はないでしょうか? こちらを読んだのですがさっぱりわかりませんでした。 https://github.com/posabsolute/jQuery-Validation-...
-2
1 回答
840 閲覧数

テーブルの要素の並び順を入れ替えるボタンを作成したい

以下のように一番上の要素を一番下に移動させるようなボタンの処理を jQuery で書きたいのですが、どのような書き方をすればいいのでしょうか? 教えて頂けると助かります。 1   2   3 2   3   4 3 → 4  → 5 4   5   1 5   1   2 HTMLコード: <div class="contents contents--table"...

1
2 3 4 5
13