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

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

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

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

jQuery

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

Q&A

解決済

1回答

1907閲覧

IEのみに、jQueryプラグインpushbar.jsが効かないです。

schatten

総合スコア13

jQueryプラグイン

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

jQuery

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

0グッド

1クリップ

投稿2019/04/23 06:55

前提・実現したいこと

IEのみ動作しないプラグインがあり、困っています。
pushbar.jsというハンバーガメニューのjQueryプラグインです。
1行目に対して、syntax errorとだけ記載がありますが、それのみです。
pushbar.js自体はいじっておりません。
jQueryは、3.3.1を使っています。

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

エラーメッセージ pushbar.js syntax error (1,1)

該当のソースコード

Javascript

1class Pushbar { 2 constructor(config = { overlay: true, blur: false }) { 3 this.activeBar = null; 4 this.overlay = false; 5 6 if (config.overlay) { 7 this.overlay = document.createElement('div'); 8 this.overlay.classList.add('pushbar_overlay'); 9 document.querySelector('body').appendChild(this.overlay); 10 } 11 12 if (config.blur) { 13 const mainContent = document.querySelector('.pushbar_main_content'); 14 if (mainContent) { 15 mainContent.classList.add('pushbar_blur'); 16 } 17 } 18 19 this.bindEvents(); 20 } 21 22 get opened() { 23 const { activeBar } = this; 24 return Boolean(activeBar instanceof HTMLElement && activeBar.classList.contains('opened')); 25 } 26 27 get activeBarId() { 28 const { activeBar } = this; 29 return activeBar instanceof HTMLElement && activeBar.getAttribute('data-pushbar-id'); 30 } 31 32 static dispatchOpen(pushbar) { 33 const event = new CustomEvent('pushbar_opening', { bubbles: true, detail: { pushbar } }); 34 pushbar.dispatchEvent(event); 35 } 36 37 static dispatchClose(pushbar) { 38 const event = new CustomEvent('pushbar_closing', { bubbles: true, detail: { pushbar } }); 39 pushbar.dispatchEvent(event); 40 } 41 42 static findElementById(pushbarId) { 43 return document.querySelector(`[data-pushbar-id="${pushbarId}"]`); 44 } 45 46 handleOpenEvent(e) { 47 e.preventDefault(); 48 const pushbarId = e.currentTarget.getAttribute('data-pushbar-target'); 49 if (pushbarId) { 50 this.open(pushbarId); 51 } 52 } 53 54 handleCloseEvent(e) { 55 e.preventDefault(); 56 this.close(); 57 } 58 59 handleKeyEvent(e) { 60 if (this.opened && e.keyCode === 27) { 61 this.close(); 62 } 63 } 64 65 bindEvents() { 66 const triggers = document.querySelectorAll('[data-pushbar-target]'); 67 const closers = document.querySelectorAll('[data-pushbar-close]'); 68 69 triggers.forEach(trigger => trigger.addEventListener('click', e => this.handleOpenEvent(e), false)); 70 closers.forEach(closer => closer.addEventListener('click', e => this.handleCloseEvent(e), false)); 71 72 if (this.overlay) { 73 this.overlay.addEventListener('click', e => this.handleCloseEvent(e), false); 74 } 75 document.addEventListener('keyup', e => this.handleKeyEvent(e)); 76 } 77 78 open(pushbarId) { 79 // Current bar is already opened 80 if (String(pushbarId) === this.activeBarId && this.opened) { 81 return; 82 } 83 84 // Get new pushbar target 85 const pushbar = Pushbar.findElementById(pushbarId); 86 87 if (!pushbar) return; 88 89 // Close active bar (if exists) 90 if (this.opened) { 91 this.close(); 92 } 93 94 Pushbar.dispatchOpen(pushbar); 95 pushbar.classList.add('opened'); 96 97 const Root = document.querySelector('html'); 98 Root.classList.add('pushbar_locked'); 99 Root.setAttribute('pushbar', pushbarId); 100 this.activeBar = pushbar; 101 } 102 103 close() { 104 const { activeBar } = this; 105 if (!activeBar) return; 106 107 Pushbar.dispatchClose(activeBar); 108 activeBar.classList.remove('opened'); 109 110 const Root = document.querySelector('html'); 111 Root.classList.remove('pushbar_locked'); 112 Root.removeAttribute('pushbar'); 113 114 this.activeBar = null; 115 } 116} 117 118

試したこと

他のプラグインは正常に作動しています。また、jQueryのバージョンを変えてみましたが、それでも動きませんでした。構文自体のエラーがどこなのかが分からずお手上げ状態となっています。
拙い文章で申し訳ございませんが、もしお力になれる方がいれば、非常に嬉しく思います。
よろしくお願いいたします。

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

https://oncebot.github.io/pushbar.js/

これが、元となるプラグインです。このプラグイン自体も、IEでは動かないことがわかりました。
つまり、IEに対応していないということでしょうか。

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

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

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

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

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

guest

回答1

0

ベストアンサー

IEがclassに対応していないためと思われます。

js

1class test{ 2 constructor() { 3 alert("hoge"); 4 } 5} 6let l = new test();

投稿2019/04/23 07:42

m.ts10806

総合スコア80850

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

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

m.ts10806

2019/04/23 07:43

マイクロソフト側から「IEはもう使わないで」とコメントが出ているので、そこは捨ててもいいところとは個人的に思います。
schatten

2019/04/23 09:26

質問にお答えいただき、誠にありがとうございます。 マイクロソフト自体が非推奨しているとは知りませんでした。 捨てることにしますね。
x_x

2019/04/24 04:26

404のようですが、あってますか?
m.ts10806

2019/04/24 04:35

x_xさん ご指摘ありがとうございます。途中でURL切れてました。コメント編集しました
x_x

2019/04/24 04:36

修正ありがとうございます
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問