アプリ版：「スタンプのみでお礼する」機能のリリースについて

セレクトボックス日付同士の比較について

解決済

  • 質問者：itio
  • 質問日時：
  • 回答数：4件

以下をどなたか教えていただけないでしょうか？よろしくお願いします。
二つのセレクトボックスで年/月/日を作成する。
さらに追加ボタンを押したときに
1.日付を比較しどちらかが一方が存在しない場合アラートを表示する。
2.開始日と終了日が前後していたらアラートを表示する。
3.OKであればテキストボックスに日付を出力する

以上です。javascript初心者ですが、よろしくお願いいたします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (4件)

No.1ベストアンサー

  • 回答者： steel_gray
  • 回答日時：

よくわからない部分があるので補足願います。



＝＝＝＝＝＝＝＝＝＝＝＝
開始日　＿年　＿月　＿日
終了日　＿年　＿月　＿日
[さらに追加]
[テキストボックス]
＝＝＝＝＝＝＝＝＝＝＝＝
↑こんな画面があったとして・・・

利用者が開始日と終了日を入力(選択)する。

[さらに追加]ボタンを押されたら、
・全て入力されているか、
・日付が前後していないか、
をチェックし、NGならアラートを出す。

OKであればテキストボックスに日付を出力…なんの日付を出力するんでしょうか？？

この回答への補足

回答ありがとうございます。
＝＝＝＝＝＝＝＝＝＝＝＝
[テキストボックス]
[セレクトボックス
開始日　＿年　＿月　＿日～終了日　＿年　＿月　＿日]
[追加ボタン]
＝＝＝＝＝＝＝＝＝＝＝＝
利用者が開始日と終了日を選択
　　　　　　↓　　　　　　　　　　　　　　false　　
日付の妥当性チェック（開始日、終了日ともに）→アラート出力
　　　　　　↓true false
日付画前後していないかチェック→アラート出力→アラート出力
↓true
日付＿年　＿月　＿日～＿年　＿月　＿日をテキストボックスに出力

といった感じです。説明不足ですいません。

補足日時：2006/12/15 15:57
通報する
    • good
    • 0
    • 件
通報する

No.4

  • 回答者： yambejp
  • 回答日時：

#3です。


そこまで書いて何がわからないのでしょうか？
十分ご自身で解くスキルはありそうです。
ざっと書いてみましたので参考にしてみてください。

<HTML>
<HEAD>
<SCRIPT language="JavaScript">
function addFunc(f){
var y1 = f.y1.value;
var m1 = f.m1.value -1;
var d1 = f.d1.value;
var y2 = f.y2.value;
var m2 = f.m2.value -1;
var d2 = f.d2.value;

var start_date = setDate(y1,m1,d1);
var end_date = setDate(y2,m2,d2);
if(start_date==false || end_date==false){
alert("日付が変");
return false;
}
if(start_date>end_date){
alert("日付が逆？");
return false;
}
var str ="";
str+=start_date.getFullYear()+"年";
str+=(start_date.getMonth()+1)+"月";
str+=start_date.getDate()+"日";
str+="～";
str+=end_date.getFullYear()+"年";
str+=(end_date.getMonth()+1)+"月";
str+=end_date.getDate()+"日";
f.text1.value=str
return true;
}
function setDate(y,m,d){
var date=new Date(y,m,d);
if(date.getFullYear()!=y || date.getMonth()!=m || date.getDate()!=d ) return false;
return date;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
開始日：<SELECT name="y1" >
<OPTION value="2000">00</OPTION>
<option value="2006">06</option>
<option value="2007"selected>07</option>
<option value="2008">08</option>
<option value="2009">09</option>
<option value="2010">10</option>
</SELECT>年
<SELECT name="m1" >
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</SELECT>月
<SELECT name="d1">
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</SELECT>日<br />
開始日：<SELECT name="y2" >
<OPTION value="2000">00</OPTION>
<option value="2006">06</option>
<option value="2007"selected>07</option>
<option value="2008">08</option>
<option value="2009">09</option>
<option value="2010">10</option>
</SELECT>年
<SELECT name="m2" >
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</SELECT>月
<SELECT name="d2">
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</SELECT>日<br>
<INPUT type="button" value="追加" onClick="addFunc(this.form);"><br>
<INPUT type="text" name="text1" value="" size="50" readonly>
</FORM>
</BODY>
</HTML>
    • good
    • 0
    • 件
通報する
この回答へのお礼

回答ありがとうございます！
私が思っていたものそのものです。
初心者なのでネットであれこれ参考にしたのですが、応用が利かなくて．．．今回のを参考にさらに応用力がつくように勉強していきたいと思います。
本当にありがとうございます。

通報する
お礼日時：2006/12/19 09:18

No.3

  • 回答者： yambejp
  • 回答日時：

とりあえず一度日付型のデータにしてしまうとよいでしょう。


こんな感じでわかりますか？

<script language=javascript>
function test(){
//月は0月からはじまるので注意
var d1=new Date(2006,11, 15);
var d2=new Date(2006,11, 16);
if(d1 < d2){
str =d1.getFullYear()+"年"+(d1.getMonth()+1)+"月"+d1.getDate()+"日";
str+="～";
str+=d2.getFullYear()+"年"+(d2.getMonth()+1)+"月"+d2.getDate()+"日";
alert(str)
}
}
</script>
<form>
<input type=button value="test" onClick="test()">
</form>

ただし日付けの妥当性については、Date()は拡大解釈
してしまうようなので、できあがった日付けデータから
年月日を取り出して、元の数字と違わないかチェックすると
よいかもしれません。

この回答への補足

回答ありがとうございます。
今のところここまでできたのですが、
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!--
function dateCheck(obj){
obj = obj.form;
var years = obj.years.value;
var months = obj.months.value;
var days = obj.days.value;
var flag = true;
years = parseInt(years);
months = parseInt(months) - 1;
days = parseInt(days);
var dates = new Date(years,months,days);
if (dates.getYear() < 1900) {
if (years != dates.getYear() + 1900) { flag = false; }}
else {if (years != dates.getYear()) { flag = false; }}
if (months != dates.getMonth()) { flag = false; }
if (days!= dates.getDate()) { flag = false; }
if (flag) {window.alert("入力された日付は存在します");}
else {window.alert("入力された日付は存在しません");}
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<SELECT name="years" >
<OPTION value="2000">00</OPTION>
<option value="2006">06</option>
<option value="2007"selected>07</option>
<option value="2008">08</option>
<option value="2009">09</option>
<option value="2010">10</option>
</SELECT>　
<SELECT name="months" >
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</SELECT>　
<SELECT name="days">
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</SELECT>
<INPUT type="button" value="日付チェック" onClick="dateCheck(this);">
</FORM>
</BODY>
</HTML>

あとは
同様なセレクトボックスをもうひとつ作成し、ボタンをクリックすると日付の期間が前後していないかチェックするようにようにしたいのですが、なにかアドバイスよろしくお願いします。

補足日時：2006/12/18 11:59
通報する
    • good
    • 0
    • 件
通報する
この回答へのお礼

回答ありがとうございました。良回答に選んだつもりが質問に対する回答は2個しか採点できないんですね。
初めての採点だったので申し訳ない気持ちでいっぱいです。
とてもよい回答をしていただきありがとうございました。

通報する
お礼日時：2006/12/19 11:41

No.2

  • 回答者： VCAT
  • 回答日時：

セレクトボックスは２群計６個と読みましたが、


それぞれに日付チェックも必要ですか？
どちらか一方に存在しないだけでアラートの意味不明。
つまり、片方は狂っていてもいいと？
テキストボックスに日付を、はムダでは？
差分の日数のこと？

この回答への補足

回答ありがとうございます。
＝＝＝＝＝＝＝＝＝＝＝＝
[テキストボックス]
[セレクトボックス
開始日　＿年　＿月　＿日～終了日　＿年　＿月　＿日]
[追加ボタン]
＝＝＝＝＝＝＝＝＝＝＝＝
利用者が開始日と終了日を選択
　　　　　　↓　　　　　　　　　　　　　　false　　
日付の妥当性チェック（開始日、終了日ともに）→アラート出力
　　　　　　↓true 　　　　　　　　　　　　false
日付画前後していないかチェック→アラート出力→アラート出力
↓true
日付＿年　＿月　＿日～＿年　＿月　＿日をテキストボックスに出力

といった感じです。説明不足ですいません。

補足日時：2006/12/15 16:07
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報