- ベストアンサー
スマートフォンでjavascriptが一部動かない！原因と解決方法を解説
- 初心者向けのプログラミングで、スマートフォンでjavascriptが一部動かないという問題が発生しています。今回は、その原因と解決方法を解説します。
- 具体的には、一つの目セレクトボックスの中身に影響される二つ目のセレクトボックスがスマートフォンで反応しないという現象です。これを解決するためには、適切なコーディングと指定を行う必要があります。
- 下記のソースコードを参考に、一つ目のセレクトボックスと二つ目のセレクトボックスの関連付けやオプションの追加を行ってください。これにより、スマートフォンでも正常に動作するようになります。
- a7a7a77a7a74
- お礼率97% (48/49)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
かいとうがつきませんね。（おぶじぇくとしこうでもりさげているのに） ぜんかくくうはくもじは、すべてはんかくくうはくうもじに ちかんしてください ちなみに、どちらの機種も もちあわせておりません。うごかないかも？！ （かいておきながら、ちょっとまずそうなのが、あるような・・・） <!DOCTYPE html> <meta charset="utf-8"> <title>オブジェクト指向っぽく？</title> <style> </style> <body> <select name="tabemono"> <option value="">選択</option> <option value="野菜">野菜</option> <option value="フルーツ">フルーツ</option> <option value="魚">魚</option> </select> <select name="tabemono2" ></select> <script> function SelectChanger (baseSelect, targetSelect, values) { this.baseSelect = baseSelect; this.targetSelect = targetSelect; this.values = values; } SelectChanger.prototype.handleEvent = function () { var t = this.targetSelect; var v = this.values[this.baseSelect.value]; while (t.hasChildNodes ()) t.removeChild (t.firstChild); if (v) v.forEach (function (v) { var opt = this.ownerDocument.createElement ('option'); opt.value = v; opt.textContent = v; t.appendChild (opt); }, t); } SelectChanger.create = function (baseSelect, targetSelect, values) { if (3 > arguments.length) throw new Error (); var obj = new SelectChanger (baseSelect, targetSelect, values); baseSelect.addEventListener ('change', obj, false); obj.handleEvent (); baseSelect = targetSelect = null; return obj; }; //設定はここから SelectChanger.create ( document.querySelector ('select[name="tabemono"]'), document.querySelector ('select[name="tabemono2"]'), { '野菜': ['ほうれんそう', 'にんじん'], 'フルーツ': ['りんご', 'なし', 'みかん'], '魚': ['あじ', 'さけ'] , } ); </script>
お礼
お礼遅くなり申し訳ございません。 アドバイス通りやってみます ありがとうございました