---

• 設置方法
  • 必須項目の変更
  • パスワードの最低文字数の変更・削除
  • アラートで表示するテキストの変更
  • アラートを表示しない
• アラートの代わりに未入力項目の線の色を変更
• パスワードの最低文字数、数字・英字のみの制限
• 更新履歴など 2010 12-18

設置方法

　デフォルトでは名前とコメント本文を必須項目とし、パスワードを入力した際は4文字を最低文字数とします。

　変更箇所はコメントフォーム部分です。コメントエリアとコメント編集エリアの2か所です。

---

( 1 ) テンプレートHTML内を「<!--comment_area-->」で検索します（ctrl+Fキー）。見つかったら、その直前に次のコードAを入れます。見つからない場合はhead内やbody内の適当な位置に入れます。

<!--not_index_area--><!--not_titlelist_area--><!--not_category_area--> <!--not_tag_area--><!--not_search_area--><!--not_page_area--> <script type="text/javascript"><!-- function commentCheck(e){ var c=[[ 'name','名前' ],[ 'body','コメント' ]]; var m='パスワードは4文字以上必要です。'; for(var i=0,x=[],y='',z='',d=document;i<c.length;i++){ var n=d.getElementsByName(e+'['+c[i][0]+']')[0]; if(n&&n.value=='')x.push(c[i][1]); } var p=d.getElementsByName(e+'[pass]')[0],ls=location.search.indexOf('rno='); if(p&&ls<0&&p.value!=''&&p.value.length<4)z=m; y=(x.length>0)?x.join('、')+'が未入力です。\n'+z:z; if(y.length>0){alert(y);return false;} return true;} --></script> <!--/not_page_area--><!--/not_search_area--><!--/not_tag_area--> <!--/not_category_area--><!--/not_titlelist_area--><!--/not_index_area-->

<!--comment_area-->

---

( 2 ) <!--comment_area-->の少し下に次のようなコードを発見できます。（nameやidなどはテンプレートによって異なります。「comment_form」などに書き換える必要ありません）

<form action="./" method="post" name="comment_form" id="comment_form">

　formの後ろに「 onsubmit="return commentCheck('comment')"」を追加します。

<form onsubmit="return commentCheck('comment')" action="./" method="post" name="comment_form" id="comment_form">

　formが見つからない場合は、テンプレートHTML内を「comment[no]」で検索します（ctrl+Fキー）。その少し前にあります。

---

( 3 ) 次にテンプレートHTML内を「edit[rno]」で検索します（ctrl+Fキー）。見つかったら、その少し前に先と同じようなコードを発見できます。

<form action="./" method="post" name="comment_form" id="comment_form">

　formの後ろに「 onsubmit="return commentCheck('edit')"」を追加します。

<form onsubmit="return commentCheck('edit')" action="./" method="post" name="comment_form" id="comment_form">

---

　以上で完了です。正常に動作しないときはコードAをhead要素内やbody要素内の適当な位置に移動させます。

　あとは送信ボタンの近くに「名前・タイトルは必須です。パスワードは4文字以上ご入力ください。」などとテキストを表示するといいかもしれません。

• 必須項目の変更
• パスワードの最低文字数の変更・削除
• 最低文字数の指定＋数字・英字のみのパスワードを指定できないように
• 数字・英字のみのパスワードを指定できないように
• アラートで表示するテキストの変更
• アラートを表示しない

必須項目の変更

　変更する箇所はコードAの var c= 部分です。

var c=[[ 'name','名前' ],[ 'body','コメント' ]];

　タイトルを必須項目とする場合は [ 'title','タイトル' ] を追加します。

var c=[[ 'name','名前' ],[ 'body','コメント' ],[ 'title','タイトル' ]];

　パスワードを必須項目とする場合は [ 'pass','パスワード' ] を追加します。

var c=[[ 'name','名前' ],[ 'body','コメント' ],[ 'pass','パスワード' ]];

　URLを必須項目とする場合は [ 'url','URL' ] を追加します。

var c=[[ 'name','名前' ],[ 'body','コメント' ],[ 'url','URL' ]];

　メールを必須項目とする場合は [ 'mail','メール' ] を追加します。

var c=[[ 'name','名前' ],[ 'body','コメント' ],[ 'mail','メール' ]];

※先頭以外に追加するときはあいだに「,」を入れます。

　名前のみ必須。

var c=[[ 'name','名前' ]];

　タイトルのみ必須。

var c=[[ 'title','タイトル' ]];

　パスワードのみ必須。

var c=[[ 'pass','パスワード' ]];

• ▲

パスワードの最低文字数の変更・削除

　最低文字数を変更する場合は 4 の数値を変更します。数値を増やすと最低文字数が増加します。

if(p&&ls<0&&p.value!=''&&p.value.length<5)z=m;

var m='パスワードは5文字以上必要です。';

　文字数を指定しない場合は次の3行を削除します。

var m='パスワードは4文字以上必要です。';

 var p=d.getElementsByName(e+'[pass]')[0];
 if(p&&ls<0&&p.value!=''&&p.value.length<4)z=m;

• ▲

最低文字数の指定＋数字・英字のみのパスワードを指定できないように

 var m='パスワードは4文字以上必要です。';

　「\n」を追加。

 var m='パスワードは4文字以上必要です。\n';

 if(p&&ls<0&&p.value!=''&&p.value.length<4)z=m;

　上記を下記に変更。

 if(p&&ls<0){
  if(p.value!=''&&p.value.length<4)z=m;
  if(/^[0-9]+$/.test(p.value))z+='数字のみのパスワードはご指定できません。';
 }

　英字のみも含める場合はさらに3行目を変更します。

if(/^([0-9]+|[a-zA-Z]+)$/.test(p.value))z+='数字または英字のみのパスワードはご指定できません。';

• ▲

数字・英字のみのパスワードを指定できないように

　最低文字数は指定しません。

 var m='パスワードは4文字以上必要です。';

　上記を削除。

 if(p&&ls<0&&p.value!=''&&p.value.length<4)z=m;

　上記を下記に変更。

 if(p&&ls<0&&/^[0-9]+$/.test(p.value))z='数字のみのパスワードはご指定できません。';

　英字のみも含める場合はさらに変更します。

 if(p&&ls<0&&/^([0-9]+|[a-zA-Z]+)$/.test(p.value))z='数字または英字のみのパスワードはご指定できません。';

• ▲

アラートで表示するテキストの変更

　変更する箇所はコードAの var c= 部分です。

　各項目の[ ]内の右側が表示される項目名になります。

var c=[[ 'name','名前' ],[ 'title','タイトル' ]];

　あいだの文字と後半のテキストは y= 部分で指定します。

y=(x.length>0)?x.join('、')+'が未入力です。\n'+z:z;

　パスワードの最低文字数テキストは var m= 部分で指定します。

var m='パスワードは4文字以上必要です。';

■サンプル

var c=[[ 'name','Name' ],[ 'title','Title' ]];

var m='パスワードは4文字以上ご指定ください。';

y=(x.length>0)?x.join(' , ')+' をご入力ください。\n'+z:z;

■表示結果
Name , Title をご入力ください。
パスワードは4文字以上ご指定ください。

• ▲

アラートを表示しない

　アラートを表示しないときはコードAの alert(y); を削除します。

if(y.length>0){return false;}

　入力項目がそれほどたくさんあるわけではないので、送信ボタンの近くに「名前・タイトルは必須です。パスワードは4文字以上ご入力ください。」というようなテキストがあれば、いちいちアラートを表示する必要はないかもしれません。

• ▲

アラートの代わりに未入力項目の線の色を変更する

　設置方法の( 1 ) のコードを丸ごと以下のコードに変更します。

<!--not_index_area--><!--not_titlelist_area--><!--not_category_area--> <!--not_tag_area--><!--not_search_area--><!--not_page_area--> <script type="text/javascript"><!-- function commentCheck(e){ var c=['name','body'],b='1px #ee3300 solid'; for(var i=0,x=[],y=true,d=document;i<c.length;i++){ var n=d.getElementsByName(e+'['+c[i]+']')[0], z=(n&&n.value=='')?true:false; if(z){y=false;n.style.border=b;}else{n.removeAttribute('style');} } var p=d.getElementsByName(e+'[pass]')[0],ls=location.search.indexOf('rno='); if(p&&ls<0&&p.value!=''&&p.value.length<4){y=false;p.style.border=b; }else{p.removeAttribute('style');} return y;} --></script> <!--/not_page_area--><!--/not_search_area--><!--/not_tag_area--> <!--/not_category_area--><!--/not_titlelist_area--><!--/not_index_area-->

　そして、送信ボタンの近くに「名前・タイトルは必須です。パスワードは4文字以上ご入力ください。」のようなテキストを入れます。

• 線の太さ・色の変更
• 必須項目の変更
• パスワードの最低文字数の変更
• 最低文字数の指定＋数字・英字のみのパスワードを指定できないように
• 数字・英字のみのパスワードを指定できないように

線の太さ・色の変更

　b= の部分を変更します。1pxが線の太さ、ee3300が線の色です。

b='1px #ee3300 solid';

黒

b='1px #000000 solid';

必須項目の変更

　変更する箇所は var c= 部分です。

var c=['name','body'];

　タイトルを必須項目とする場合は 'title' を追加します。

var c=['name','body','title'];

　パスワードを必須項目とする場合は 'pass' を追加します。

var c=['name','body','pass'];

　URLを必須項目とする場合は 'url' を追加します。

var c=['name','body','url'];

　メールを必須項目とする場合は 'mail' を追加します。

var c=['name','body','mail'];

※先頭以外に追加するときは「,」を入れます。

　パスワードのみ必須。

var c=['pass'];

　タイトルのみ必須。

var c=['title'];

• ▲

パスワードの最低文字数の変更・削除

　最低文字数を変更する場合は 4 の数値を変更します。数値を増やすと最低文字数が増加します。

if(p&&ls<0&&p.value!=''&&p.value.length<4){y=false;p.style.border=b;

　文字数を指定しない場合は次の3行を削除します。

 var p=d.getElementsByName(e+'[pass]')[0],ls=location.search.indexOf('rno=');
 if(p&&ls<0&&p.value!=''&&p.value.length<4){y=false;p.style.border=b;
 }else{p.removeAttribute('style');}

• ▲

最低文字数の指定＋数字・英字のみのパスワードを指定できないように

 if(p&&ls<0&&p.value!=''&&p.value.length<4){y=false;p.style.border=b;
 }else{p.removeAttribute('style');}

　上記を下記に変更。

 if(p&&ls<0){if(p.value!=''&&p.value.length<4||/^[0-9]+$/.test(p.value)){
 y=false;p.style.border=b;}else{p.removeAttribute('style');}}

　英字のみも含める場合はさらに1行目を変更します。

if(p&&ls<0){if(p.value!=''&&p.value.length<4||/^([0-9]+|[a-zA-Z]+)$/.test(p.value)){

• ▲

数字・英字のみのパスワードを指定できないように

　最低文字数は指定しません。

 if(p&&ls<0&&p.value!=''&&p.value.length<4){y=false;p.style.border=b;
 }else{p.removeAttribute('style');}

　上記を下記に変更。

 if(p&&ls<0){if(/^[0-9]+$/.test(p.value)){
 y=false;p.style.border=b;}else{p.removeAttribute('style');}}

　英字のみも含める場合はさらに1行目を変更します。

if(p&&ls<0){if(/^([0-9]+|[a-zA-Z]+)$/.test(p.value)){

• ▲

パスワードの最低文字数、数字・英字のみの制限

　入力項目は必須にしません。

　設置方法の( 1 ) のコードを丸ごと以下のコードに変更します。

<!--not_index_area--><!--not_titlelist_area--><!--not_category_area--><!--not_tag_area--><!--not_search_area--><!--not_page_area--> <script type="text/javascript"><!-- function commentCheck(e){ var p=document.getElementsByName(e+'[pass]')[0],ls=location.search.indexOf('rno='); if(p&&ls<0&&p.value!=''&&p.value.length<4){ alert('パスワードは4文字以上ご指定ください。'); return false;} } --></script> <!--/not_page_area--><!--/not_search_area--><!--/not_tag_area--><!--/not_category_area--><!--/not_titlelist_area--><!--/not_index_area-->

---

パスワードの最低文字数の変更

　4 の数値を変更します。数値を増やすと最低文字数が増加します。

if(p&&ls<0&&p.value!=''&&p.value.length<4){

アラートで表示するテキストの変更・表示しない

　alert('');内のテキストを変更します。

alert('パスワードは4文字以上ご指定ください。');

アラートを表示しない場合は次の行を削除します。

alert('パスワードは4文字以上ご指定ください。');

アラートの代わりに線の色を変更する

alert('パスワードは4文字以上ご指定ください。');

上記を以下に変更します。

p.style.border='1px #ee3300 solid';

　1pxが線の太さ、ee3300が線の色です。

最低文字数の指定＋数字・英字のみのパスワードを指定できないように

 if(p&&ls<0&&p.value!=''&&p.value.length<4){
  alert('パスワードは4文字以上ご指定ください。');
  return false;}

　上記を下記に変更。

 if(p&&ls<0){var z='';
  if(p.value!=''&&p.value.length<4)z='パスワードは4文字以上ご指定ください。\n';
  if(/^[0-9]+$/.test(p.value))z+='数字のみのパスワードはご指定できません。';
  if(z!=''){alert(z);return false;}
 }

　英字のみも含める場合はさらに3行目を変更します。

if(/^([0-9]+|[a-zA-Z]+)$/.test(p.value))z+='数字または英字のみのパスワードはご指定できません。';

数字・英字のみのパスワードを指定できないように

 if(p&&ls<0&&p.value!=''&&p.value.length<4){
  alert('パスワードは4文字以上ご指定ください。');

　上記を下記に変更。

 if(p&&ls<0&&/^[0-9]+$/.test(p.value)){
  alert('数字のみのパスワードはご指定できません。');

　英字のみも含める場合はさらに変更します。

 if(p&&ls<0&&/^([0-9]+|[a-zA-Z]+)$/.test(p.value)){
  alert('数字または英字のみのパスワードはご指定できません。');

• ▲

更新履歴など

　コメント本文が空欄の場合はページ遷移後にFC2側のアラートが表示されますが、ページ遷移せずに警告を表示した方がいいような気がするので、デフォルトの必須項目にコメントを加えています。

　scriptを外部ファイルに入れるときは、「<!--」と「-->」内のコードをjsファイルに追加します。

• 2010 12-18 - 記事整形。
• 2010 11-27 - [1]25日の変更点をさらに修正。[2]デフォルトの必須項目変更。タイトル→コメント本文。[3]数字または英字のみのパスワードを指定できないようにを追加。
• 2010 11-25 - 編集ページでの文字制限を削除。
• 2010 11-22 - 公開。

関連記事

• FC2ブログコメントのパスワードは未入力か複雑に　トリップ検索・変換
• カテゴリ編集・一覧ページの仕様変更 指定件数表示と検索
• ブログIDや画像などのファイルからFC2ブログアドレスを調べる方法
• コメントの名前などを必須項目に、パスワードの最低文字数を指定
• ブログ設定のツイート・いいね！ボタンの仕様・横並びデザイン
• ブログの設定更新時と更新後のブログ初回アクセスに時間がかかる
• FC2ブログ検索フォームプラグイン（OR検索、コメント、トラックバック）