[jquery] タグが付いた質問

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

絞り込み
並べ替え
タグ付けされた
1
1 回答
3,833 閲覧数

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

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

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

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

fadeInがSPに効かず、PCのみに効く blockが原因の理由

jQueryでanimate__fadeInLeft、PCでは効きますが、SPでは左からからでなく ただのfadeInになってしまいました。 <section class="container"> <div class="contents1"> <picture class="...
1
2 回答
2,977 閲覧数

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

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

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

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

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 回答
78 閲覧数

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

jQueryでホバー中に別の要素にホバーしたい (5ちゃんねるの吹き出しのユーザービリティーをjQueryで実現したい)

jQueryで5ちゃんねるの吹き出しのようなユーザービリティを実現したく奮闘しているのですが、結構調べたのですがどうすればいいかまったくわかりません。 画像で言えば >>729 にホバーしたときに吹き出しの要素がbodyにappendされているようでカーソルが要素から離れれば、removeで吹き出しは消えます。ここまでは普通に実装できるのですが、...
0
1 回答
544 閲覧数

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

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

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

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

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

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

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 回答
322 閲覧数

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

JSONのデータを取得してHTMLの要素に入れたい

data.jsonというJSONのデータを取得して、データ内に入っている名前、住所、仕事内容のデータをindex.htmlのHTML内のcontents--tableの中に挿入したいのですが、data.jsonのデータすら読み取る事に失敗してしまいます。どのようなコードを打てば実装できるでしょうか。script.jsの中にコードをうちます。(script.jsの中にはまだ何も入ってません。) ...
0
0 回答
111 閲覧数

ページネーションのページを変えると(次のページに行くと)、ループ機能の一部がおかしくなってしまう。

WordPressでアーカイブページを作成しています。 他のサイトで、答えていただけませんでしたのでマルチポストにします、すいません。 https://teratail.com/questions/r0uwzlzi1q5s1q https://qiita.com/keikkkk/questions/70a529fdd4e210698baf また、...
0
1 回答
168 閲覧数

ページネーションを作成していますが、jQueryが上手く設定できません

WordPressでサイトを作成しています。 アーカイブページで、ページネーションを入れたいです。 下記サイトの通りにやっていますがうまくいきません。 https://shanabrian.com/web/jquery/pagination.php 実際にやってみると表示されるサイトが10で、ページネーションのリンクの数も3とか5とかが、理想ですが、1つしかリンク(...
0
1 回答
172 閲覧数

ページネーションを作成することができません。

初心者です。急ぎですのでこれからマルチポストです。 https://teratail.com/questions/exowk0f9j67yso https://qiita.com/keikkkk/questions/106ae1cdb1284d92041a WordPressでサイトを制作しています。 アーカイブページのページネーションを作成するため、下記サイトを参考にしています。 https://...
0
0 回答
181 閲覧数

PHPでCometを実装したとき、たまにデータを出力しない

やっていること PHPでCometによるチャットシステムを作成しています。 // このご時世になんでWebSocketを使わないんだ? という話はなしでお願いします。 概ねはうまく動くのですが、時々PHPが情報を吐き出してくれないことがあり、どうにかならないかお尋ねしたいです。 構造 ページはinput.html, output.html, comet.php, chat.txt, ...
1
1 回答
2,459 閲覧数

bootstrap のmodal がiOSの端末でスクロール出来ない

bootstrap3でmodal内で検索できるような仕組みを作りました。テキストボックスの内容をAjaxでPHPに送信して結果をJsonで受け取ります。その内容をmodal内で表示するのですが、結果が多くなったときにスクロール(スワイプ)が出来ない状況になりました。どうもこの現象がiOSの端末のみで発生しているようです。 この解決方法をご存知の方がいらっしゃったら教えて下さい。
0
1 回答
180 閲覧数

ウェブサイトをどのiPadの機種(〇世代、Air/Proなど)で見ているか判定する方法は?

私のサイトはiPadの様々な機種で閲覧することを想定しています。 タイトルのように、今どの機種のiPadでウェブサイトを閲覧しているか判定する必要に迫られています。iPad Airなのか、Proなのか、それは何世代なのか? JavaScriptかJqueryどちらかで調べたいと考えています。 使用機種のOSはすべてiPadOS 13~15のいずれかが想定されるので、...
0
1 回答
281 閲覧数

1つのフォームに(form_with)に複数ボタンを設置、かつimage_submit_tagで異なる機能を呼び出したい。

前提・実現したいこと 1つのフォームに(form_with)に複数ボタンを設置、かつimage_submit_tagで異なる機能を呼び出したい。 以下コードの場合、更新、削除ボタンを実装したい http://yiaowang.web.fc2.com/programing/ruby_base/rails_views_submit.html 発生している問題・エラーメッセージ 参考サイトでは、...
0
0 回答
274 閲覧数

親要素にTransformを指定した場合の画面固定について

ウェブサイトの制作初心者、初質問です。 ページのヘッダーを画面の先頭にposition:fixedで固定していたのですが、 サイトがスマホのみのレイアウトのためpcでみた時は少し大きく表示したいとのオーダーがあり、 zoomプロパティはfirefoxで使えないためhtml要素にtransform:scale();を使って画面幅が768px以上の時は1.25倍で表示するようにしました。 @media ...
0
0 回答
1,016 閲覧数

ハンバーガーメニューを開いている最中bodyはスクロールしない設定にしていたが、メニュー内のドロップダウンを開いた時メニュー内だけでなくbodyもスクロールしてしまいます

html、cssがすこし触れる程度でjavascriptは主にコピペで使用している初心者です。 スマホでハンバーガーメニューを作成した際、 メニューを全画面で開いた時に隠れているbody全体はスクロールしないようjQueryで設定していましたが、 メニューの中身がドロップダウンで開くようになるとbodyのスクロールが復活してしまいました。 ...
0
1 回答
524 閲覧数

閉じるボタン(X)が、元のハンバーガーボタン(三本線)戻らない問題を解決したい

実現したいこと 【jQuery・ハンバーガーメニュー】 閉じるボタン(X)を、元のハンバーガーボタン(三本線)に戻したいです 状況の説明 jQueryでハンバーガーメニューを実装しています。 スマホナビが開いている状況で、リンクをクリックすると、 スマホナビが閉じて リンク先のセクションにスムーススクロールされます ここまでは良いのですが、閉じるボタン(X)が、元のハンバーガーボタン(三本線)...
0
2 回答
2,026 閲覧数

fullcalendarのイベント削除について

fullcalendarのv3.9.0を使用しています。 動き ・左の予定リストからイベントを追加し、日付へドラッグアンドドロップができます。 ・日付へ入れた予定をダブルクリックすると予定を消せるようになる 困っていること ・ダブルクリックをすると予定を削除できるのですが、消えた後にほかの予定をドラッグアンドドロップすると消えたはずの予定が復活してしまいます。 例:1月7日の予定を削除する→...
0
1 回答
1,058 閲覧数

jQueryでの可変の表示位置の取得

表示位置が可変するページにて、 スクロールしてナビの位置に来た時にウインドウ上部に固定したいと思い下記のコードを書きました。 https://jsfiddle.net/aq8j1rLL/9/ $(function() { $(window).on('load resize', function() { var navScrollHeight = $('#gnav'...
0
1 回答
469 閲覧数

Rails でいいねの create アクションが実行されない

※他のサイトでも同様の質問を行っています。解決後はそれぞれ更新致します。よろしくお願いします。 https://teratail.com/questions/av2uvajgpeg8dy 前提・実現したいこと 投稿された質問(post)に対して回答したコメント(comment)に非同期通信でいいね(good)を押す機能を実装したいです。 発生している問題・エラーメッセージ ...
0
1 回答
2,656 閲覧数

swiper.jsのloop時末端が途切れる

下記のように swiper クリック時に slideTo で 中央にフォーカスするようにしているんですが、始端や終端まで進めると途切れてしまいます。 マウスドラッグ or touchEvent を発生させると、また要素がクローンされるようなんですが、それをプログラムだけで完結出来る方法をご存知であれば知りたいです。 swiper.slideTo() の後 swiper.update() ...
0
1 回答
93 閲覧数

jqueryでサイドバーのリンククリックによるスムーススクロールをしたい

jsfiddleをご覧ください。:https://jsfiddle.net/ac189xhn/ メインコンテンツを掲載する部分とサイドバーの2か所からなるページを作ります。 サイドバーのリンクをクリックすると、そのhrefに記載したidと同じメインコンテンツのsectionタグへとスムーススクロールできるようにしたいのですが、現状ですと2回同じリンクをクリックした時や、...
0
1 回答
224 閲覧数

slick sliderのslideToShowの値をスワイプする度にランダムに変更させたいです。

こんにちは。wordpressでサイト制作をしていて、スライダーにはプラグインの"slick slider"を使用しています。 ***実現したいこと*** スワイプ、またはスライドが切り替わるたびに表示させる画像の数を変更したいです。 表示させたい枚数の範囲は、1−2枚です。 例)スライド => 画像2枚表示, 2回目スライド => 画像1枚表示、 3回目スライド =...
0
0 回答
76 閲覧数

最初に読み込む背景画像の表示時間を短くしたい

jsファイルでトップページの画像ファイルだけを最初に2秒程度表示して、そこからトップページを表示していますが、 トップページの画像ファイルの表示時間を一瞬だけ(0.5秒以内)にするにはどのようにすればいいでしょうか。 (function($){ $(function() { if($.cookie("access") == undefined) { $...

1
2 3 4 5
13