質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

1686閲覧

テーブルを固定する便利なプラグインを見つけたのに、エラーです

saayan

総合スコア12

jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

1クリップ

投稿2019/04/28 17:19

前提・実現したいこと

テーブルを固定するプラグインをいくつか試し、最も便利なこちらを利用することにしたのですけど、

【Github】
https://github.com/lai32290/TableHeadFixer

【demo】
https://www.jqueryscript.net/demo/jQuery-Plugin-For-Fixed-Table-Header-Footer-Columns-TableHeadFixer/examples/fixHeadAndRight.html

実際にきちんと固定されるのに、コンソールにエラーが出てしまいます。

発生している問題・エラーメッセージ

なにやら「solveRightColspan」さんが見つからないとのことで…

ReferenceError: solveRightColspan is not defined

該当のソースコード

上の【Github】にあるように、右列を固定すべくこんなふうに書いています。

jQuery

1$("table").tableHeadFixer( { "right" : 1} );

試したこと1

まず右列でなく左列固定を書いてみました。

jQuery

1$("table").tableHeadFixer( { "left" : 1} );

このときは、エラーも出ず、しかし固定もされませんでした。

試したこと2

次にエラーを検索しました。すると同様のエラーに遭遇した方がいらしたようで、それに対してこのようなアドバイスを見つけました。

https://github.com/lai32290/TableHeadFixer/issues/46

ですが、このアドバイスの意味がわかりません。「その関数をつかってね」とのことですが、いったい、どのように?

それが冒頭の【Github】に書いておらず、エラーの解決方法がわからない状態です。

もし同様のプラグインをお使いになった方や、事情にお詳しい方がいらっしゃればと思い、ご質問させて頂きました。

なにとぞ、宜しくお願いいたします。

補足情報(FW/ツールのバージョンなど)

jQueryは最新の3.3.1で、ブラウザはFirefox、Chromeいずれでもエラーです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

詳細までプラグインの説明見てないですが、ソースだけ見る限り不具合に見えますね。

プルリクエストも投げられてるみたいですが、まだマージされていないようです。
プルリクエスト#51
([試したこと2]に記載されたissueもこの修正のことと思います)

開発者に確認して問題なければ上記プルリクエストをマージしてもらうか、
別のプラグインを使うのが良いかと思います。
(発生条件が以下なので、右列の固定解除にこだわれなければ使用可能ですが)

ちなみに発生条件は、以下のいずれかみたいです。
(headはデフォルトtrueなので今回は上の例に該当)

{ "head" : true, "right" : 1以上} { "foot" : true, "right" : 1以上}

投稿2019/04/28 18:08

aikon_marimo

総合スコア1083

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

saayan

2019/04/28 18:18

そうだったのですか。調べて頂きありがとうございます。リンク先のプルリクエストの2か所を修正しましたところ、今回のエラーはなくなりました。けれど、そもそもの固定がされなくなってしまいました。 これは質問の「試したこと1」で左列固定がされないのと同様で、わたしのやり方が悪いのでしょうか?実際はプルリクエストを修正すれば正しく動作するはずでしょうし、そもそも左列固定ができないのはおかしいですもんね。むぅ。
aikon_marimo

2019/04/28 18:43

examplesフォルダにあるfixHeadAndRight.html等でも固定されないでしょうか? こちらが固定されるのであれば、やり方がどこかおかしいと思います。 (質問に記載頂いたコードはあってると思いますので、HTMLのtableあたりの記載が間違ってる可能性があります)
aikon_marimo

2019/04/28 19:02 編集

[追記] 失礼しました。tableだから以下は大丈夫ですね。 ------ あー、質問に記載頂いたコードもおかしいですね。 jQueryのidの指定があやまってます。 誤:$("table") 正:$("#テーブルに付けたID") 例) <table id="fixTable">の場合は、$("#fixTable")
saayan

2019/04/28 19:23 編集

どうもありがとうございます!おかげ様でできました。つらい夜でしたw
saayan

2019/04/28 19:24 編集

頂戴した [追記] について蛇足よりな後日談です。原因はid指定ではなくてCSSでした。 table に「table-layout: fixed;」をかけて th の width を指定していたのですが、このプラグインがその width を修正してしまうせいで指定した width が確保されず、よってスクロールが発生せず、固定も起こらない。というものでした。 なので th の width に important をかけることで、プラグインによる幅の修正を抑え込み、無事スクロールすべきtable幅を確保したところ解決致しました。 夜分遅くまで本当にありがとうございました!
aikon_marimo

2019/04/28 19:31

解決されたみたいで良かったです。 (ほとんどご自身で解決できてるようなのであまり力になれずすみません...) こんな夜分までされてるとこを見ると色々大変そうな事情を察しますが、お疲れ様でした!w
saayan

2019/04/28 19:37

とんでもないですー!わたしでは絶対にプルリクエストにはたどり着けませんでした。ありがとうございますw
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問