[jquery] タグが付いた質問
jQueryとは、ジョン・レシグによって開発された、JavaScriptのライブラリである。エレメントの指定がCSSセレクタと同様の記述で選択ができる。「$」を「jQuery」のエイリアスとして定義されており、関数の呼び出しを容易にしている。また、関数をチェーンさせることで、より柔軟な操作が可能となっている。
641
質問
0
票
0
回答
25
閲覧数
jQueryのmodaal.jsで紐付けができない
aタグを使わずにbuttonでやると紐付けができないのですが、どなたかご教示いただけると嬉しいです。
<button class="js-modal" data-group="gallery" data-modaal-content-source="#content01">表示</button>
<...
1
票
1
回答
3,915
閲覧数
jQueryプラグインの「slick」を利用しつつランダム表示させたい
slickを利用したカルーセルをランダムに表示するようしたいのですが、ランダム表示にはなっているものの、下記3点の不具合があり解決方法をご教授いただけますと幸いです。なお、カルーセルさせる画像の枚数は10点としています。
全10点の画像のうち1点が2回(どの画像になるかはその都度変わります)表示される
(意図通りに)表示されない画像が1点ある
最後の画像(10枚目)から最初の画像(1枚目)...
0
票
1
回答
1,157
閲覧数
ファイル名を取得してサーブレットクラスに渡したい。
画面でテーブルに対して行をクリックし、黄色行になっている状態で「ファイル名取得ボタン」を押し、黄色行のファイル名をJavaのサーブレットクラスに渡したいと思います。テーブルに対して行をクリックし、黄色行にするとこまでできているのですが、ファイル名を取得してJavaのサーブレットクラスにファイル名を渡すコードをどう書くか分かりません。どう書けばよろしいでしょうか。
<!DOCTYPE ...
0
票
0
回答
41
閲覧数
jquery draggableで複数のdivの中だけを移動する方法がわかりません
jquery uiのdraggableでbodyのdivの中だけをdrag出来るようにしたいです。
containmentを使うと良いみたいですが、
containment: '.body',
にすると、一つの.bodyの中でしかdrag出来ません。
全部の.bodyの中、つまり.headerを除いた全体で移動がしたいのですが、方法がわかりません。
snipetで確認が出来ます。
...
1
票
1
回答
62
閲覧数
jqueryでdivなどをdragしている最中にdrag対象の文字を変えてしまうとresize出来なくなってしまう
jqueryでdragしている間そのdivの内容の文字をtext()で変更すると
resizeが出来なくなってしまうのです。
詳しくはsnipetで実行してみてください。
jqueryのtext()の代わりに.get(0).innerTextに変更しても同じ現象が発生します。
text()の代わりにhtml()にしても同じ現象が発生します。
変更した後にもう一度draggable()...
1
票
1
回答
1,542
閲覧数
IE9でローカルのファイルを読み込むことは可能ですか?
やりたいことは下記のようにファイル名をinput要素で指定してもらい、ボタンを押したらその内容を取得したいです。
csvファイルを読み込むことを想定しています。
IE10以降ではFileAPIが使えるのですが、IE9では動きません。
下記のように書けばできるかと思いましたが、このコードは動きませんでした。
すいません、制約を書いてませんでした。
...
1
票
2
回答
3,022
閲覧数
モーダルダイアログの子ウィンドウから親ウィンドウの関数を呼び出す方法
cakePHP2 + mysql + bootsrap3 でサイトを構築しています。
親ウィンドウから、入力ウィンドウとして子ウィンドウ①を開き、
必要なIDがなければ生成するための子ウィンドウ②を立ち上げてID登録をして
子ウィンドウ①に返す といった処理を組もうとしています。
その際に、どのようにすれば子ウィンドウ①から子ウィンドウ②に値を返せるかが
わかりません。
お手数ですが、...
0
票
1
回答
792
閲覧数
fullcalendarの定期イベントdowの一部上書き(非表示)について。
fullcalendarのイベントについて行き詰っており質問です。
実現したいこと
国民の休日をgoogleから取得
スタッフの毎週の出勤日をカレンダーに表示[](eventSourcesにdowで実装)←ここまでは実装できています。
会社の公休日にスタッフの出勤日を表示しないようにしたい。(←ここで行き詰ってます。)
fullcalendar 現状のコード
<script src='...
0
票
0
回答
385
閲覧数
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
回答
83
閲覧数
Rails & jQuery 検証ツールエラーについて
非同期通信を実装したい
Ruby on RailsとjQueryで「英単語クイズアプリ」の作成をしています。
ユーザーは出題された英単語の穴埋めを考えて英単語を完成させ、「text_filed_tag」に入力し、送信をクリックします。正解なら次の問題へ、不正解なら再度同じ問題を解く、というものです。
解決方法わかる方いらっしゃいましたら是非ご教授お願いします。
検証ツールで表示されるエラーです。
...
0
票
1
回答
200
閲覧数
jQuery Datatables にAPIで取得したデータベースデータが表示できない。
問題点
ソースコード上、js/index.jsにハードコードしたdata変数では Datatablesに表示ができます。
しかし、APIで取得したデータtest_dataでは表示できません。
console.logで表示したデータは、ブラウザのデベロッパーツールの表示において、どちらのデータも以下のように同じ形式にしか見えませんでした。
Attray(5)
0:{id:1,name:'A'}
...
0
票
0
回答
97
閲覧数
入力した数値の単位を項目ごとに指定する方法
初めまして
プログラミングを学んでいる者です。
どうやって実現すればいいかわからないので先輩方の力を借りたいです。
実現したいこと
各項目 A,B,C があって
Aが追加されたら数値入力の単位を0.1ずつ増減できる
Bが追加されたら数値入力の単位を0.5ずつ増減できる
Cが追加されたら数値入力の単位を1.0ずつ増減できる
というのを実現したいです。
HTML,Javascript,Jquery,...
0
票
1
回答
94
閲覧数
タブレットでChromeブラウザ でoption 要素が disabled しない
シンプルなOption要素でDisabledしたいのですが、タブレットでChromeから見るとDisabledされません。
<select name="fruits">
<option value="peach" disabled>peach</option>
<option value="apple">apple</...
0
票
1
回答
1,312
閲覧数
PC版Safariにおいて背景画像が表示されない
PC版(Macでのみ確認)Safariにおいて、リンク要素にロールオーバーした際にbodyの背景画像を設定しているんですが表示されず、下記ページの方法を試したんですがそれでも解決されませんでした。
http://16deza.com/note/background-image-pcsafari-not-displayed/
問題の起こっているサイトはこちらになります。
http://hyld....
0
票
1
回答
78
閲覧数
MonacaとOnsen UIで作成したアプリがメニュー切り替えすると表示されなくなる
【作成環境】
Monaca
Onsen UI
Javascript
jQuery
【作りたいアプリ】
TOPページにカレンダーを表示したい
【今起きている問題】
読み込み時はカレンダーが表示されているが、メニュー切り替えするとカレンダーが表示されない。
【確認したこと】
・リロードすると表示される
・呼び出したい関数の中に挿入したconsole....
0
票
1
回答
322
閲覧数
npmで取得したJavaScriptライブラリ (rollup.js) をHTMLから呼び出す方法
知りたいこと
npmというものを使えばJavaScriptライブラリのバージョン管理ができると聞き少しずつ触って見ておりますが、どのようにしてhtmlからそのJavaScriptを呼び出せばいいのかがわからないので知りたいです。
npmはPHPでいうcomposer、Pythonで言うpip、nimでいうnimbleのようなものだと思っております。
ここも間違っていたらご指摘いただけると嬉しいです。...
0
票
0
回答
52
閲覧数
jQueryでホバー中に別の要素にホバーしたい (5ちゃんねるの吹き出しのユーザービリティーをjQueryで実現したい)
jQueryで5ちゃんねるの吹き出しのようなユーザービリティを実現したく奮闘しているのですが、結構調べたのですがどうすればいいかまったくわかりません。
画像で言えば >>729 にホバーしたときに吹き出しの要素がbodyにappendされているようでカーソルが要素から離れれば、removeで吹き出しは消えます。ここまでは普通に実装できるのですが、...
0
票
1
回答
589
閲覧数
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
回答
92
閲覧数
jQueryで*:contains('AAA')セレクタで要素を選択させた際に直近の要素のみを選択できるようにしたい
<table>
<tr><td>AAA</td></tr>
<tr><td>BBB</td></tr>
</table>
というHTMLがあったとして、
jQueryで
$("*:contains('AAA')").addClass('hoge');
...
1
票
0
回答
304
閲覧数
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
回答
395
閲覧数
jQuery UI Sortable で移動範囲を指定したい
tableタグで作成した表内で、移動を制限したいと思っています。
表の最上部と最下部を「対象外(ハンドルなし)」にはできます。
しかし、他の要素を「最上部より上」「最下部より下」に移動できてしまいます。
この動きを抑制する方法はあるでしょうか?
よろしくお願いします。
<!DOCTYPE html>
<html lang="ja">
<head&...
0
票
0
回答
352
閲覧数
vimeo+player.jsでサイトに埋め込みした動画の視聴時間を計測したいが同じデータがいくつも作成されてしまう
サイトにvimeoをiframeで埋め込み
player.jsを利用して
再生(イベント発火⇨視聴開始した現在時刻を保存)
一時停止または動画終了(イベント発火⇨視聴終了した現在時刻を保存)」
[1]と[2]の差分をDBに保存
で視聴時間を登録しているのですが、なぜか同じデータが複数作成されるケースがあります。
ブラウザの問題の可能性も考え
PC:Chrome・Safari
iOS(15.7):...
0
票
1
回答
258
閲覧数
jQuery UIのSortableを用い、li要素並び替え後にも要素の情報を取得したい
現在Webaアプリケーションを作成しながらプログラミングの学習をしているものです。
jQueryのSortableを使用して、li要素の並び替えを行なっております。
下記のソースコードは、要素をドラッグして任意に並び替えた後、要素クリックでコンソールに、innerHTMLを出力するコードになります。
しかし、要素を並び替えた後、クリックすると違う要素の情報が取得されてしまいます。...
0
票
1
回答
1,046
閲覧数
ボタンを押すと画像がフェードイン・フェードアウトするという動作をしたい
ボタンを押すと画像がフェードイン・フェードアウトするという動作をしたいのですが、上手く繋げれていないみたいです。多分idが必要だと思うのですが、どう打ち込むのが正解でしょうか?
以下は現時点での状態です。
初心者のためまだまだ分からないことが多いですがよろしくお願い致します。
0
票
1
回答
853
閲覧数
jQueryにてdiv要素にキー入力を代行させる方法
やりたいこと
下記のdiv要素である"down"をクリックしている間は、下矢印キーを押し続けている扱いにする方法はないでしょうか?
試す限りでは押し続けている判定は、onmousedownを使えば出来そうですが、javascriptに「キー入力を代わりに入力させる」方法がわかりません。
<div class="down">
<h1&...
0
票
2
回答
469
閲覧数
jQueryを用いたスライダーでページナビゲーションごとスライドさせるにはどうしたらよいでしょうか。
jQueryを用いたスライダーでページナビゲーション(左右に表示されるものではなく、ページ下部にスライドさせるスライダーの枚数のリンクを表示したナビゲーションです)をスライド画像ごとスライドさせるにはどうしたらよいでしょうか。
良い案が見つからず悩んでいるのでご存知の方いらっしゃいましたらご教示いただきたいです。
スライダーはbxsliderを使用する想定ですが、...
0
票
1
回答
129
閲覧数
クリックした画像を変更したい
クリックした画像をコールバック関数とアニメーションを使って変更させたいです。
以下のコードだとリストの画像をクリックするとアニメーションは適用されているのですが、画像は初期値のsample1が表示され画像の変更ができないです。
どうすればクリックした画像に変更できるでしょうか?
<body>
<main>
<h1>...
0
票
3
回答
261
閲覧数
jQueryを使って選択した画像を非同期処理で表示させたい
問題
画像を表示は出来た。
データとして、sqlのデータに保存ができていない。
確認で、抽出工程を確認すると画像を指定してあげるとできていた。
目標
laravelで画像を非同期処理でファイルから選択して表示させたい
また、他ファイルでも表示できるようにする
コメントアウトしてる方、してない方どちらも試しているが表示されない
blade
<div id="image"&...
0
票
1
回答
67
閲覧数
(this).scrollTop()の終了の仕方がわからない
普段、簡単なjQueryなどは使うのですが、複雑になるといつもつまづいてしまいます。
どなたか下記の動作を実現するにはどう作ればいいのか方法を教えていただきだいです。
やりたいこと
ある高さまでスクロールしたら画像に追従用のclassを追加
上にスクロールして画像が元からあった場所まで戻ってきたら追従用のclassを外す
画像が追従中、画像をクリックしたら追加したclassを外す(...
0
票
0
回答
177
閲覧数
リンクのアドレスを取得したい
拡張機能を作成しようとしています。
リンクを右クリックし、コンテキストメニューに追加した新しい項目をクリックしたときに、リンクのアドレスを取得したいです。
現時点では、右クリックをしたらコンテキストメニューに項目が追加されるようにはなっているのですが、クリックしたリンクのアドレスを取得する方法が分かりません。わかる方いらしましたら、お手数をおかけしますがよろしくお願いします。
現時点でのコードです↓...
0
票
1
回答
206
閲覧数
jQueryとjQuery UI でアニメをさせたところ,何故か無限に繰り返してしまう
要約
jQueryとjQueryUIを用いて,マウスオーバーすると色が変わり,マウスアウトすると元に戻るアニメをつけようとしていたところ,.stop()の付け方によっては無限の繰り返しが発生してしまうことがわかりました.しかし,考えても原因がわかりません.
マウスを動かしていないのにmouseoverイベントが繰り返し発生しているようなのですが,それはおかしなことだと思います.
...
0
票
1
回答
1,556
閲覧数
jQuery-Validation-Engine でエラー発生時の吹き出し表示をクリックしても消えないようにしたい
フォームのバリデーションにjQuery-Validation-Engineというプラグインを使用しています。
エラーがあるときに吹き出しが出て、その吹き出しをクリックすると消えます。
これをクリックしても消えないようにする方法はないでしょうか?
こちらを読んだのですがさっぱりわかりませんでした。
https://github.com/posabsolute/jQuery-Validation-...
-2
票
1
回答
736
閲覧数
テーブルの要素の並び順を入れ替えるボタンを作成したい
以下のように一番上の要素を一番下に移動させるようなボタンの処理を 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,334
閲覧数
JSONのデータを取得してHTMLの要素に入れたい
data.jsonというJSONのデータを取得して、データ内に入っている名前、住所、仕事内容のデータをindex.htmlのHTML内のcontents--tableの中に挿入したいのですが、data.jsonのデータすら読み取る事に失敗してしまいます。どのようなコードを打てば実装できるでしょうか。script.jsの中にコードをうちます。(script.jsの中にはまだ何も入ってません。)
...
0
票
0
回答
117
閲覧数
ページネーションのページを変えると(次のページに行くと)、ループ機能の一部がおかしくなってしまう。
WordPressでアーカイブページを作成しています。
他のサイトで、答えていただけませんでしたのでマルチポストにします、すいません。
https://teratail.com/questions/r0uwzlzi1q5s1q
https://qiita.com/keikkkk/questions/70a529fdd4e210698baf
また、...
0
票
1
回答
174
閲覧数
ページネーションを作成していますが、jQueryが上手く設定できません
WordPressでサイトを作成しています。
アーカイブページで、ページネーションを入れたいです。
下記サイトの通りにやっていますがうまくいきません。
https://shanabrian.com/web/jquery/pagination.php
実際にやってみると表示されるサイトが10で、ページネーションのリンクの数も3とか5とかが、理想ですが、1つしかリンク(...
0
票
1
回答
177
閲覧数
ページネーションを作成することができません。
初心者です。急ぎですのでこれからマルチポストです。
https://teratail.com/questions/exowk0f9j67yso
https://qiita.com/keikkkk/questions/106ae1cdb1284d92041a
WordPressでサイトを制作しています。
アーカイブページのページネーションを作成するため、下記サイトを参考にしています。
https://...
0
票
0
回答
191
閲覧数
PHPでCometを実装したとき、たまにデータを出力しない
やっていること
PHPでCometによるチャットシステムを作成しています。
// このご時世になんでWebSocketを使わないんだ? という話はなしでお願いします。
概ねはうまく動くのですが、時々PHPが情報を吐き出してくれないことがあり、どうにかならないかお尋ねしたいです。
構造
ページはinput.html, output.html, comet.php, chat.txt, ...
1
票
1
回答
2,479
閲覧数
bootstrap のmodal がiOSの端末でスクロール出来ない
bootstrap3でmodal内で検索できるような仕組みを作りました。テキストボックスの内容をAjaxでPHPに送信して結果をJsonで受け取ります。その内容をmodal内で表示するのですが、結果が多くなったときにスクロール(スワイプ)が出来ない状況になりました。どうもこの現象がiOSの端末のみで発生しているようです。
この解決方法をご存知の方がいらっしゃったら教えて下さい。
0
票
1
回答
189
閲覧数
ウェブサイトをどのiPadの機種(〇世代、Air/Proなど)で見ているか判定する方法は?
私のサイトはiPadの様々な機種で閲覧することを想定しています。
タイトルのように、今どの機種のiPadでウェブサイトを閲覧しているか判定する必要に迫られています。iPad Airなのか、Proなのか、それは何世代なのか?
JavaScriptかJqueryどちらかで調べたいと考えています。
使用機種のOSはすべてiPadOS 13~15のいずれかが想定されるので、...
0
票
1
回答
321
閲覧数
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
回答
325
閲覧数
親要素にTransformを指定した場合の画面固定について
ウェブサイトの制作初心者、初質問です。
ページのヘッダーを画面の先頭にposition:fixedで固定していたのですが、
サイトがスマホのみのレイアウトのためpcでみた時は少し大きく表示したいとのオーダーがあり、
zoomプロパティはfirefoxで使えないためhtml要素にtransform:scale();を使って画面幅が768px以上の時は1.25倍で表示するようにしました。
@media ...
0
票
0
回答
1,082
閲覧数
ハンバーガーメニューを開いている最中bodyはスクロールしない設定にしていたが、メニュー内のドロップダウンを開いた時メニュー内だけでなくbodyもスクロールしてしまいます
html、cssがすこし触れる程度でjavascriptは主にコピペで使用している初心者です。
スマホでハンバーガーメニューを作成した際、
メニューを全画面で開いた時に隠れているbody全体はスクロールしないようjQueryで設定していましたが、
メニューの中身がドロップダウンで開くようになるとbodyのスクロールが復活してしまいました。
...
0
票
1
回答
574
閲覧数
閉じるボタン(X)が、元のハンバーガーボタン(三本線)戻らない問題を解決したい
実現したいこと
【jQuery・ハンバーガーメニュー】 閉じるボタン(X)を、元のハンバーガーボタン(三本線)に戻したいです
状況の説明
jQueryでハンバーガーメニューを実装しています。
スマホナビが開いている状況で、リンクをクリックすると、
スマホナビが閉じて
リンク先のセクションにスムーススクロールされます
ここまでは良いのですが、閉じるボタン(X)が、元のハンバーガーボタン(三本線)...
0
票
2
回答
2,085
閲覧数
fullcalendarのイベント削除について
fullcalendarのv3.9.0を使用しています。
動き
・左の予定リストからイベントを追加し、日付へドラッグアンドドロップができます。
・日付へ入れた予定をダブルクリックすると予定を消せるようになる
困っていること
・ダブルクリックをすると予定を削除できるのですが、消えた後にほかの予定をドラッグアンドドロップすると消えたはずの予定が復活してしまいます。
例:1月7日の予定を削除する→...
0
票
1
回答
1,082
閲覧数
jQueryでの可変の表示位置の取得
表示位置が可変するページにて、
スクロールしてナビの位置に来た時にウインドウ上部に固定したいと思い下記のコードを書きました。
https://jsfiddle.net/aq8j1rLL/9/
$(function() {
$(window).on('load resize', function() {
var navScrollHeight = $('#gnav'...
0
票
1
回答
499
閲覧数
Rails でいいねの create アクションが実行されない
※他のサイトでも同様の質問を行っています。解決後はそれぞれ更新致します。よろしくお願いします。
https://teratail.com/questions/av2uvajgpeg8dy
前提・実現したいこと
投稿された質問(post)に対して回答したコメント(comment)に非同期通信でいいね(good)を押す機能を実装したいです。
発生している問題・エラーメッセージ
...
0
票
1
回答
2,864
閲覧数
swiper.jsのloop時末端が途切れる
下記のように swiper クリック時に slideTo で 中央にフォーカスするようにしているんですが、始端や終端まで進めると途切れてしまいます。
マウスドラッグ or touchEvent を発生させると、また要素がクローンされるようなんですが、それをプログラムだけで完結出来る方法をご存知であれば知りたいです。
swiper.slideTo() の後 swiper.update() ...
0
票
1
回答
99
閲覧数
jqueryでサイドバーのリンククリックによるスムーススクロールをしたい
jsfiddleをご覧ください。:https://jsfiddle.net/ac189xhn/
メインコンテンツを掲載する部分とサイドバーの2か所からなるページを作ります。
サイドバーのリンクをクリックすると、そのhrefに記載したidと同じメインコンテンツのsectionタグへとスムーススクロールできるようにしたいのですが、現状ですと2回同じリンクをクリックした時や、...