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

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

新規登録して質問してみよう
ただいま回答率
85.50%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Internet Explorer

Internet Explorer(IE;MSIE)はマイクロソフトが開発したウェブブラウザです。Microsoft Windowsに組み込まれています。

JavaScript

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

jQuery

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

Q&A

解決済

1回答

830閲覧

動的にselectのoptionを作成したいが IE11 でのみ構文エラー

taro_nii_chan

総合スコア207

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Internet Explorer

Internet Explorer(IE;MSIE)はマイクロソフトが開発したウェブブラウザです。Microsoft Windowsに組み込まれています。

JavaScript

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

jQuery

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

0グッド

0クリップ

投稿2018/07/26 22:47

やりたい事

csv ファイルを読み込む php を作っておいて、
html の中の select に ajax で option を追加したいです。

ソース

データファイル(data.csv)

csv

10,default 21,first 32,second 43,third

データファイル読み込みphp(read_data.php)

php

1<?php 2$file = file("data.csv"); 3foreach($file as $line) { 4 $array_data[] = explode(",", $line); 5} 6echo json_encode($array_data, JSON_UNESCAPED_UNICODE);

index.html

html

1<!DOCTYPE html> 2<html lang="ja" dir="ltr"> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 </head> 7 <body> 8 <!-- https://developer.mozilla.org/ja/docs/Web/HTML/Element/select --> 9 <!-- メモ 10 この要素の内容は静的であり、編集可能ではありません。 --> 11 12 <select id="text"> 13 </select> 14 15 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 16 <script> 17 $(function() { 18 function set_select_via_ajax() { 19 $.ajax ({ 20 type: 'post', 21 url: 'read_data.php', 22 dataType: 'json', 23 }) 24 .done((data, textStatus, jqXHR) => { 25 var len = data.length; 26 for (var i = 0; i < len; i++) { 27 if (i == 0) { 28 $("#text").append("<option value=" + data[i][0] + " selected>" + data[i] [1]+ "</option>"); 29 } else { 30 $("#text").append("<option value=" + data[i][0] + ">" + data[i] [1]+ "</option>"); 31 } 32 } 33 }) 34 .fail((jqXHR, textStatus, errorThrown) => { 35 console.log('fail', jqXHR.status); 36 }) 37 .always(() => { 38 // console.log('always'); 39 }); 40 }; 41 42 function set_select_directory() { 43 var data = ["default", "first", "second", "third"]; 44 for (var i = 0; i < 4; i++) { 45 if (i == 0) { 46 $("#text").append("<option value='" + i + "' selected>" + data[i] + "</option>"); 47 console.log("<option value='" + i + "' selected>" + data[i] + "</option>"); 48 } else { 49 $("#text").append("<option value='" + i + "'>" + data[i] + "</option>"); 50 console.log("<option value='" + i + "'>" + data[i] + "</option>"); 51 } 52 } 53 } 54 55 // select を作成する 56 // set_select_directory(); 57 set_select_via_ajax(); 58 }) 59 </script> 60 </body> 61</html>

試したブラウザ

mac の chrome(バージョン: 67.0.3396.9)
win の edge(バージョン: 42.17134.0)
win の IE11(バージョン: 11.1.17134.0)

状況

chrome と edge ではプルダウンが表示されるのですが、
IE11 だけ

SCRIPT1002: 構文エラーです。test6 (24,50)

と表示され、プルダウンが表示されません。

試しに ajax を使わないで jQuery で option を作るバージョン(set_select_directory())を作ってみましたが、
それとは関係なく同じ場所で同じエラーが発生してプルダウンは表示されませんでした。

懸念事項

index.html のソースの中にもコメントで書きましたが、
https://developer.mozilla.org/ja/docs/Web/HTML/Element/select

この要素の内容は静的であり、編集可能ではありません。

とありました。
これだけ読むと IE11 での実装はそもそも出来ないのかなと思ってしまうのですが。

質問

  • IE11 は何が構文エラーだと言っているのでしょうか?

  • IE11 でもその他のブラウザと同様のプルダウンを作成するにはどうしたらいいのでしょうか?

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

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

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

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

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

guest

回答1

0

ベストアンサー

IE11では、Arrow Function(=>)に未対応です。functionで書き直しましょう。

投稿2018/07/26 23:01

maisumakun

総合スコア145121

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

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

taro_nii_chan

2018/07/27 00:15

出来ました。 ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問