質問編集履歴
5
修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -94,19 +94,6 @@
|
|
|
94
94
|
<script src="https://unpkg.com/@barba/core@next"></script>
|
|
95
95
|
<script src="https://www.promisejs.org/polyfills/promise-6.1.0.min.js"></script>
|
|
96
96
|
|
|
97
|
-
<script>
|
|
98
|
-
$(function() {
|
|
99
|
-
let checkedsum; //チェックが入っている個数
|
|
100
|
-
$('.job_checkbox').on("click",function(){
|
|
101
|
-
checkedsum = $('.job_checkbox:checked').length; //チェックが入っているチェックボックスの取得
|
|
102
|
-
if( checkedsum > 0 ){
|
|
103
|
-
$('.job_checkbox').prop("required",false); //required属性の解除
|
|
104
|
-
}else{
|
|
105
|
-
$('.job_checkbox').prop("required",true); //required属性の付与
|
|
106
|
-
}
|
|
107
|
-
});
|
|
108
|
-
});
|
|
109
|
-
</script>
|
|
110
97
|
|
|
111
98
|
<script>
|
|
112
99
|
$(function() {
|
4
修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -58,27 +58,7 @@
|
|
|
58
58
|
<span>ご職業 <span class="required">【必須】</span></span>
|
|
59
59
|
</p>
|
|
60
60
|
<div>
|
|
61
|
-
<span>
|
|
62
|
-
<input id="engineer" class="job_checkbox" type="checkbox" name="job" value="エンジニア" required/><label for="engineer">SE(システムエンジニア)</label>
|
|
63
|
-
|
|
61
|
+
<!-- 中略 -->
|
|
64
|
-
<span>
|
|
65
|
-
<input id="designer" class="job_checkbox" type="checkbox" name="job" value="webデザイナー" required/><label for="designer">webデザイナー</label>
|
|
66
|
-
</span>
|
|
67
|
-
<span>
|
|
68
|
-
<input id="programmer" class="job_checkbox" type="checkbox" name="job" value="プログラマー" required/><label for="programmer">プログラマー</label>
|
|
69
|
-
</span>
|
|
70
|
-
<span>
|
|
71
|
-
<input id="wrighter" class="job_checkbox" type="checkbox" name="job" value="ライター" required/><label for="wrighter">ライター</label>
|
|
72
|
-
</span>
|
|
73
|
-
<span>
|
|
74
|
-
<input id="security" class="job_checkbox" type="checkbox" name="job" value="保守・管理" required/><label for="security">保守・管理</label>
|
|
75
|
-
</span>
|
|
76
|
-
<span>
|
|
77
|
-
<input id="other" class="job_checkbox" type="checkbox" name="other" value="その他" required/><label for="other">その他</label>
|
|
78
|
-
</span>
|
|
79
|
-
<span>
|
|
80
|
-
※複数選択可
|
|
81
|
-
</span>
|
|
82
62
|
</div>
|
|
83
63
|
</div>
|
|
84
64
|
<p class="form_flex">
|
3
修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -31,61 +31,77 @@
|
|
|
31
31
|
}
|
|
32
32
|
?>
|
|
33
33
|
|
|
34
|
-
|
|
35
34
|
<div id="barba-wrapper">
|
|
36
35
|
<div class="barba-container">
|
|
37
36
|
|
|
38
|
-
|
|
37
|
+
<?php if( $page_flag === 1 ): ?>
|
|
39
38
|
|
|
39
|
+
<?php require('confirm.php'); ?>
|
|
40
40
|
|
|
41
|
-
|
|
41
|
+
<?php elseif( $page_flag === 2 ): ?>
|
|
42
42
|
|
|
43
|
+
<?php require('done.php'); ?>
|
|
43
44
|
|
|
44
|
-
|
|
45
|
+
<?php else: ?>
|
|
45
46
|
|
|
46
|
-
|
|
47
|
+
<div class="container">
|
|
48
|
+
<h1 class="bolder pb-3">以下のフォームにご記入いただき、<span class="inlineblock">「送信ボタン」をクリックしてください。</h1>
|
|
49
|
+
<p class="small text-dimgray text-center">※必要な場合をのぞいて、こちらから何度もメール<span class="inlineblock">することはございませんので、ご安心ください。<span class="inlineblock"></span></p>
|
|
50
|
+
</div>
|
|
51
|
+
<div class="contact_form_wrapper px-3">
|
|
52
|
+
<form action="" method="post">
|
|
53
|
+
<p class="form_flex">
|
|
54
|
+
<label class="formtitle" for="name">お名前<span class="required">【必須】</span></label><input type="text" id="name" name="name" placeholder="山田太郎" required/>
|
|
55
|
+
</p>
|
|
56
|
+
<div class="jobs">
|
|
57
|
+
<p class="formtitle">
|
|
58
|
+
<span>ご職業 <span class="required">【必須】</span></span>
|
|
59
|
+
</p>
|
|
60
|
+
<div>
|
|
61
|
+
<span>
|
|
62
|
+
<input id="engineer" class="job_checkbox" type="checkbox" name="job" value="エンジニア" required/><label for="engineer">SE(システムエンジニア)</label>
|
|
63
|
+
</span>
|
|
64
|
+
<span>
|
|
65
|
+
<input id="designer" class="job_checkbox" type="checkbox" name="job" value="webデザイナー" required/><label for="designer">webデザイナー</label>
|
|
66
|
+
</span>
|
|
67
|
+
<span>
|
|
68
|
+
<input id="programmer" class="job_checkbox" type="checkbox" name="job" value="プログラマー" required/><label for="programmer">プログラマー</label>
|
|
69
|
+
</span>
|
|
70
|
+
<span>
|
|
71
|
+
<input id="wrighter" class="job_checkbox" type="checkbox" name="job" value="ライター" required/><label for="wrighter">ライター</label>
|
|
72
|
+
</span>
|
|
73
|
+
<span>
|
|
74
|
+
<input id="security" class="job_checkbox" type="checkbox" name="job" value="保守・管理" required/><label for="security">保守・管理</label>
|
|
75
|
+
</span>
|
|
76
|
+
<span>
|
|
77
|
+
<input id="other" class="job_checkbox" type="checkbox" name="other" value="その他" required/><label for="other">その他</label>
|
|
78
|
+
</span>
|
|
79
|
+
<span>
|
|
80
|
+
※複数選択可
|
|
81
|
+
</span>
|
|
82
|
+
</div>
|
|
83
|
+
</div>
|
|
84
|
+
<p class="form_flex">
|
|
85
|
+
<label class="formtitle" for="mail">メールアドレス<span class="required">【必須】</span></label><input id="mail" type="email" name="mail" placeholder="example@mail.jp" required/>
|
|
86
|
+
</p>
|
|
87
|
+
<p class="form_flex textarea">
|
|
88
|
+
<label class="formtitle" for="comment">その他</label><textarea id="comment" type="textarea" name="message" placeholder="疑問点などがございましたらご記入ください"></textarea>
|
|
89
|
+
</p>
|
|
90
|
+
<div class="btn_wrapper">
|
|
91
|
+
<p class="submit">
|
|
92
|
+
<input type="submit" name="confirm" value="入力内容を確認する" />
|
|
93
|
+
</p>
|
|
94
|
+
<p class="reset">
|
|
95
|
+
<input type="reset" value="リセット" />
|
|
96
|
+
</p>
|
|
97
|
+
</div>
|
|
98
|
+
</form>
|
|
99
|
+
</div>
|
|
47
100
|
|
|
48
|
-
|
|
101
|
+
<?php endif; ?>
|
|
49
102
|
|
|
50
|
-
<div class="container">
|
|
51
|
-
<h1 class="bolder pb-3">以下のフォームにご記入いただき、<span class="inlineblock">「送信ボタン」をクリックしてください。</h1>
|
|
52
|
-
<p class="small text-dimgray text-center">※必要な場合をのぞいて、こちらから何度もメール<span class="inlineblock">することはございませんので、ご安心ください。<span class="inlineblock"></span></p>
|
|
53
|
-
</div>
|
|
54
|
-
<div class="contact_form_wrapper px-3">
|
|
55
|
-
<form action="" method="post">
|
|
56
|
-
<p class="form_flex">
|
|
57
|
-
<label class="formtitle" for="name">お名前<span class="required">【必須】</span></label><input type="text" id="name" name="name" placeholder="山田太郎" required/>
|
|
58
|
-
</p>
|
|
59
|
-
<div class="jobs">
|
|
60
|
-
<p class="formtitle">
|
|
61
|
-
<span>ご職業 <span class="required">【必須】</span></span>
|
|
62
|
-
|
|
63
|
-
<!-- 中略 -->
|
|
64
|
-
|
|
65
|
-
</div>
|
|
66
|
-
</div>
|
|
67
|
-
<p class="form_flex">
|
|
68
|
-
<label class="formtitle" for="mail">メールアドレス<span class="required">【必須】</span></label><input id="mail" type="email" name="mail" placeholder="example@mail.jp" required/>
|
|
69
|
-
</p>
|
|
70
|
-
<p class="form_flex textarea">
|
|
71
|
-
<label class="formtitle" for="comment">その他</label><textarea id="comment" type="textarea" name="message" placeholder="疑問点などがございましたらご記入ください"></textarea>
|
|
72
|
-
</p>
|
|
73
|
-
<div class="btn_wrapper">
|
|
74
|
-
<p class="submit">
|
|
75
|
-
<input type="submit" name="confirm" value="入力内容を確認する" />
|
|
76
|
-
</p>
|
|
77
|
-
<p class="reset">
|
|
78
|
-
<input type="reset" value="リセット" />
|
|
79
|
-
</p>
|
|
80
|
-
</div>
|
|
81
|
-
|
|
82
|
-
</form>
|
|
83
|
-
|
|
84
|
-
</div>
|
|
85
|
-
<?php endif; ?>
|
|
86
103
|
</div>
|
|
87
104
|
</div>
|
|
88
|
-
|
|
89
105
|
</section>
|
|
90
106
|
|
|
91
107
|
|
|
@@ -95,17 +111,29 @@
|
|
|
95
111
|
|
|
96
112
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
|
97
113
|
<script src="js/jquery.pjax.js"></script>
|
|
98
|
-
|
|
114
|
+
<script src="https://unpkg.com/@barba/core@next"></script>
|
|
99
|
-
|
|
115
|
+
<script src="https://www.promisejs.org/polyfills/promise-6.1.0.min.js"></script>
|
|
100
116
|
|
|
117
|
+
<script>
|
|
118
|
+
$(function() {
|
|
119
|
+
let checkedsum; //チェックが入っている個数
|
|
120
|
+
$('.job_checkbox').on("click",function(){
|
|
121
|
+
checkedsum = $('.job_checkbox:checked').length; //チェックが入っているチェックボックスの取得
|
|
122
|
+
if( checkedsum > 0 ){
|
|
123
|
+
$('.job_checkbox').prop("required",false); //required属性の解除
|
|
124
|
+
}else{
|
|
125
|
+
$('.job_checkbox').prop("required",true); //required属性の付与
|
|
126
|
+
}
|
|
127
|
+
});
|
|
128
|
+
});
|
|
129
|
+
</script>
|
|
101
130
|
|
|
131
|
+
<script>
|
|
132
|
+
$(function() {
|
|
133
|
+
Barba.Pjax.start();
|
|
134
|
+
});
|
|
135
|
+
</script>
|
|
102
136
|
|
|
103
|
-
<script>
|
|
104
|
-
$(function() {
|
|
105
|
-
Barba.Pjax.start();
|
|
106
|
-
});
|
|
107
|
-
</script>
|
|
108
|
-
|
|
109
137
|
<!-- 以下略 -->
|
|
110
138
|
```
|
|
111
139
|
|
|
@@ -116,8 +144,6 @@
|
|
|
116
144
|
<div class="barba-container">
|
|
117
145
|
|
|
118
146
|
<div class="container">
|
|
119
|
-
|
|
120
|
-
|
|
121
147
|
<h1 class="bolder pb-3">以下の内容でよろしければ、下の<span class="inlineblock">「送信する」をクリックしてください。</span></h1>
|
|
122
148
|
</div>
|
|
123
149
|
<div class="contact_form_wrapper px-3">
|
|
@@ -148,7 +174,6 @@
|
|
|
148
174
|
<input type="hidden" name="job" value="<?php echo $_POST['job']; ?>">
|
|
149
175
|
<input type="hidden" name="mail" value="<?php echo $_POST['mail']; ?>">
|
|
150
176
|
<input type="hidden" name="message" value="<?php echo $_POST['message']; ?>">
|
|
151
|
-
|
|
152
177
|
</form>
|
|
153
178
|
</div>
|
|
154
179
|
|
2
修正
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
【
|
|
1
|
+
【jQuery】Barba.jsが動きません。
|
body
CHANGED
|
File without changes
|
1
誤字
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
上記を動作させるためBarba.jsを組み込んだのですが、うまく機能しません。
|
|
7
7
|
フォームの表示自体は、ご覧のようにphpで切り替わるようにしたのですが、
|
|
8
|
-
ボタンを押すとページ
|
|
8
|
+
ボタンを押すとページがリロードされトップ位置に戻ってしまいます。
|
|
9
9
|
長いシングルページのため、
|
|
10
10
|
最下部のフォーム位置までまたスクロールしないと確認できない状態です。
|
|
11
11
|
|