編集履歴

質問編集履歴

2020/09/29 08:06

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -290,262 +290,6 @@
        </body>
-   </html><DOCTYPE html>
-    <html>
-     <head>
-      <meta charset="UTF-8">
-      <meta name="robots" content="noindex,nofollow">
-      <meta http-equiv="content-language" content="ja">
-      <meta http-equiv="Pragma" content="no-store">
-      <meta http-equiv="Cache-Control" content="no-store">
-      <meta http-equiv="Expires" content="0">
-      <!-- ビューポートの設定 -->
-      <meta name="viewport" content="width=device-width, initial-scale=1.0">
-      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
-      <title>デモ</title>
-      <style>
-        html{
-         font-size:20px;
-        }
-        body{
-         margin:30px;
-        }
-        main{
-         background-color:#f8f8f8;
-         padding:20px;
-        }
-        h2{
-         font-size:22px;
-        }
-        select,input,textarea{
-         font-family : inherit;
-         font-size:20px;
-         padding:3px;
-         border:1px solid black;
-         vertical-align:middle;
-        }
-             </style>
-        </head>
-   <body>
-   <main>
-   <h1 style="color:black;">ＤＥＭＯ</h1>
-   <!-- 2つめの計算の箇所-->
-   <h2>データ名2</h2>
-   <select id="subtotal2" style="font-size:18px;width:200px;"></select>
-   <p id="subresult2">1</p>
-   <!-- 2つめの計算の箇所ここまで-->
-   <HR style="margin: 2em 0 ;">
-   </main>
-   <script>
-       jQuery(function($){
-           var data2Json= [
-  {
-    "list": "データを選択してください",
-    "value": "1",
-    "type":"条AA"
-  },
-  {
-    "list": "aA",
-    "value": "1.2",
-    "type":"条AA"
-  },
-  {
-    "list": "いB",
-    "value": "1.5",
-    "type":"条BB"
-  },
-  {
-    "list": "うC",
-    "value": "1.8",
-    "type":"条CC"
-  }
-];
-                    $("#subtotal2").append(data2Json.map(
-                    x => $(`<option value="${x.value}">${x.list}</option>`)));
-$('#subtotal2').change(function() {
-$('#subresult2').text($(this).val());
-window.Calc2 = $(this).val();
-//gassanFnc();
-});
-               });
-           </script>
-       </body>
    </html>
 ```

編集

2020/09/29 08:06

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -18,12 +18,14 @@
 [追記]
-json埋め込み書き換えで表示はされるようになったのですが、
+・json埋め込み書き換えで表示はされるようになったのですが、
 実際のデータよりも、プルダウンメニューで多く表示されてしまいます。
+・
 ```html
@@ -116,11 +118,7 @@
         }
-        #subresult1:after{
-         content:"円";
-        }
              </style>
@@ -246,25 +244,35 @@
-   Object.keys(data2Json).forEach(function(key) {
-   $("#subtotal2").append(data2Json.map(
+                    $("#subtotal2").append(data2Json.map(
-   x => $(`<option value="${x.value}">${x.list}</option>`)));
+                    x => $(`<option value="${x.value}">${x.list}</option>`)));
+$('#subtotal2').change(function() {
+$('#subresult2').text($(this).val());
+window.Calc2 = $(this).val();
+//gassanFnc();
-   });
+});
@@ -282,6 +290,262 @@
        </body>
+   </html><DOCTYPE html>
+    <html>
+     <head>
+      <meta charset="UTF-8">
+      <meta name="robots" content="noindex,nofollow">
+      <meta http-equiv="content-language" content="ja">
+      <meta http-equiv="Pragma" content="no-store">
+      <meta http-equiv="Cache-Control" content="no-store">
+      <meta http-equiv="Expires" content="0">
+      <!-- ビューポートの設定 -->
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+      <title>デモ</title>
+      <style>
+        html{
+         font-size:20px;
+        }
+        body{
+         margin:30px;
+        }
+        main{
+         background-color:#f8f8f8;
+         padding:20px;
+        }
+        h2{
+         font-size:22px;
+        }
+        select,input,textarea{
+         font-family : inherit;
+         font-size:20px;
+         padding:3px;
+         border:1px solid black;
+         vertical-align:middle;
+        }
+             </style>
+        </head>
+   <body>
+   <main>
+   <h1 style="color:black;">ＤＥＭＯ</h1>
+   <!-- 2つめの計算の箇所-->
+   <h2>データ名2</h2>
+   <select id="subtotal2" style="font-size:18px;width:200px;"></select>
+   <p id="subresult2">1</p>
+   <!-- 2つめの計算の箇所ここまで-->
+   <HR style="margin: 2em 0 ;">
+   </main>
+   <script>
+       jQuery(function($){
+           var data2Json= [
+  {
+    "list": "データを選択してください",
+    "value": "1",
+    "type":"条AA"
+  },
+  {
+    "list": "aA",
+    "value": "1.2",
+    "type":"条AA"
+  },
+  {
+    "list": "いB",
+    "value": "1.5",
+    "type":"条BB"
+  },
+  {
+    "list": "うC",
+    "value": "1.8",
+    "type":"条CC"
+  }
+];
+                    $("#subtotal2").append(data2Json.map(
+                    x => $(`<option value="${x.value}">${x.list}</option>`)));
+$('#subtotal2').change(function() {
+$('#subresult2').text($(this).val());
+window.Calc2 = $(this).val();
+//gassanFnc();
+});
+               });
+           </script>
+       </body>
    </html>
 ```

データの書き換え

2020/09/26 02:52

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -264,32 +264,20 @@
-   Object.keys(data2Json).forEach(function(key) {
-                      var d=$('<datalist id="list">').append(data2Json.map(x=>$(`<option value="${x.list}"</option>`)));
-                   $("input#subtotal2").append(d);
                });
-               });
            </script>
        </body>

データの書き換え

2020/09/26 02:35

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -24,6 +24,8 @@
 ```html
 <DOCTYPE html>

追記

2020/09/26 02:33

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -14,284 +14,284 @@
+[追記]
+json埋め込み書き換えで表示はされるようになったのですが、
+実際のデータよりも、プルダウンメニューで多く表示されてしまいます。
 ```html
 <DOCTYPE html>
- <html>
-  <head>
-   <meta charset="UTF-8">
-   <meta name="robots" content="noindex,nofollow">
-   <meta http-equiv="content-language" content="ja">
-   <meta http-equiv="Pragma" content="no-store">
-   <meta http-equiv="Cache-Control" content="no-store">
-   <meta http-equiv="Expires" content="0">
-   <!-- ビューポートの設定 -->
-   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
-   <title>デモ</title>
-   <style>
-     html{
-      font-size:20px;
-     }
-     body{
-      margin:30px;
-     }
-     main{
-      background-color:#f8f8f8;
-      padding:20px;
-     }
-     h2{
-      font-size:22px;
-     }
-     select,input,textarea{
-      font-family : inherit;
-      font-size:20px;
-      padding:3px;
-      border:1px solid black;
-      vertical-align:middle;
-     }
-     #subresult1:after{
-      content:"円";
-     }
-          </style>
-     </head>
-<body>
-<main>
-<h1 style="color:black;">ＤＥＭＯ</h1>
-<h2>データ名1</h2>
-<input type="text" id="subtotal1" list="list" style="width:200px;">
-<p id="subresult1">0</p>
-<HR style="margin: 2em 0 ;">
-</main>
-<script>
-    jQuery(function($){
-        var sample_list= [
-            {
-                "list": "aA-3",
-                "value": "300",
-                "type":"3"
-            },
-            {
-                "list": "いB-4",
-                "value": "1000",
-                "type":"4"
-            },
-            {
-                "list": "うC-3",
-                "value": "2000",
-                "type":"3"
-            },
-            {
-                "list": "え-4",
-                "value": "300",
-                "type":"4"
-            },
-            {
-                "list": "sB-3",
-                "value": "1000",
-                "type":"3"
-            },
-            {
-                "list": "cC-4",
-                "value": "2000",
-                "type":"4"
-            }
-        ];
-            //1つめの計算
-            $.getJSON("static/data1.json", function(sample_list){
-                var d=$('<datalist id="list">').append(sample_list.map(x=>$(`<option value="${x.list}"</option>`)));
-                $("input#subtotal1").append(d);
-                $('input#subtotal1').change(function() {
-                    const value = $(this).val();
-                    const candidates = sample_list.filter(
-                    item => item.list == value);
-                        if (candidates.length > 0){
-                                $("#subresult1").text(candidates[0].value);
-                                //計算用変数Calc1に代入
-                                window.Calc1=candidates[0].value;
-                                window.hantei=candidates[0].type;
-                                console.log(hantei);
-                                window.changeValue = window.hantei;
+    <html>
+     <head>
+      <meta charset="UTF-8">
+      <meta name="robots" content="noindex,nofollow">
+      <meta http-equiv="content-language" content="ja">
+      <meta http-equiv="Pragma" content="no-store">
+      <meta http-equiv="Cache-Control" content="no-store">
+      <meta http-equiv="Expires" content="0">
+      <!-- ビューポートの設定 -->
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+      <title>デモ</title>
+      <style>
+        html{
+         font-size:20px;
+        }
+        body{
+         margin:30px;
+        }
+        main{
+         background-color:#f8f8f8;
+         padding:20px;
+        }
+        h2{
+         font-size:22px;
+        }
-                            }else{
-                            }
-                        });
-                    });
-            });
-        </script>
-    </body>
-</html>
+        select,input,textarea{
+         font-family : inherit;
+         font-size:20px;
+         padding:3px;
+         border:1px solid black;
+         vertical-align:middle;
+        }
+        #subresult1:after{
+         content:"円";
+        }
+             </style>
+        </head>
+   <body>
+   <main>
+   <h1 style="color:black;">ＤＥＭＯ</h1>
+   <!-- 2つめの計算の箇所-->
+   <h2>データ名2</h2>
+   <select id="subtotal2" style="font-size:18px;width:200px;"></select>
+   <p id="subresult2">1</p>
+   <!-- 2つめの計算の箇所ここまで-->
+   <HR style="margin: 2em 0 ;">
+   </main>
+   <script>
+       jQuery(function($){
+           var data2Json= [
+  {
+    "list": "データを選択してください",
+    "value": "1",
+    "type":"条AA"
+  },
+  {
+    "list": "aA",
+    "value": "1.2",
+    "type":"条AA"
+  },
+  {
+    "list": "いB",
+    "value": "1.5",
+    "type":"条BB"
+  },
+  {
+    "list": "うC",
+    "value": "1.8",
+    "type":"条CC"
+  }
+];
+   Object.keys(data2Json).forEach(function(key) {
+   $("#subtotal2").append(data2Json.map(
+   x => $(`<option value="${x.value}">${x.list}</option>`)));
+   });
+   Object.keys(data2Json).forEach(function(key) {
+                      var d=$('<datalist id="list">').append(data2Json.map(x=>$(`<option value="${x.list}"</option>`)));
+                   $("input#subtotal2").append(d);
+               });
+               });
+           </script>
+       </body>
+   </html>
 ```

追記

2020/09/26 02:30

投稿

Miii

スコア30

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -8,6 +8,12 @@
+※外部jsonデータを変数に入れたり、
+書き換えできるところはしています。
 ```html
 <DOCTYPE html>