回答編集履歴

1

修正

2018/08/23 20:12

投稿

退会済みユーザー
test CHANGED
@@ -1 +1,111 @@
1
1
  `<textarea>` は 子要素 `<span>` を持つことはできません。文法違反です。
2
+
3
+
4
+
5
+ ---
6
+
7
+
8
+
9
+ # サンプル
10
+
11
+
12
+
13
+ 表示用の `textarea` と 送信用の `textarea` を分けるのがポイント
14
+
15
+
16
+
17
+ ```html
18
+
19
+ <!DOCTYPE HTML>
20
+
21
+ <html lang="ja">
22
+
23
+ <head>
24
+
25
+ <meta charset="UTF-8">
26
+
27
+ <title></title>
28
+
29
+ <style type="text/css">
30
+
31
+ .hidden {
32
+
33
+ visibility: hidden;
34
+
35
+ height: 0;
36
+
37
+ width: 0;
38
+
39
+ }
40
+
41
+ </style>
42
+
43
+ </head>
44
+
45
+ <body>
46
+
47
+ <form action="" method="post">
48
+
49
+ <p>
50
+
51
+ <!-- name 属性をつけない -->
52
+
53
+ <input type="text" id="nicename" value="nicename" />
54
+
55
+ </p>
56
+
57
+ <p>
58
+
59
+ <!-- name 属性をつけない -->
60
+
61
+ <textarea id="text" cols="30" rows="10">メッセージ</textarea>
62
+
63
+ </p>
64
+
65
+
66
+
67
+ <!-- name 属性をつける -->
68
+
69
+ <textarea id="text_sending" name="text_sending" class="hidden"></textarea>
70
+
71
+
72
+
73
+ <p>
74
+
75
+ <button id="btn" type="button">送信</button>
76
+
77
+ </p>
78
+
79
+ </form>
80
+
81
+ <script type="text/javascript" src="//code.jquery.com/jquery-3.1.1.min.js"></script>
82
+
83
+ <script type="text/javascript">
84
+
85
+ $(function () {
86
+
87
+ var nicename = $('#nicename').text();
88
+
89
+ var message = $('#text').val();
90
+
91
+ var contents = '<span class="hide">' + nicename + '</span>' + message;
92
+
93
+ $("#text").val(contents);
94
+
95
+ $("#text_sending").val(message);
96
+
97
+ $("#btn").on('click', function () {
98
+
99
+ $('form').submit();
100
+
101
+ });
102
+
103
+ });
104
+
105
+ </script>
106
+
107
+ </body>
108
+
109
+ </html>
110
+
111
+ ```