【JavaScript】【作成依頼】

自作するのがしんどいので質問です。
IE,firefox,Opera にて稼動するジャストなご回答をいただいた場合、500point+いるかにて御礼させていただきます。よろしくお願いいたします。
----
【お願いしたいこと】
・<script type="text/javascript" src="hogejs.js"></script>←のような感じでHTMLファイルから呼び出したいです。
・設置&チェック時の注意点などがあればお知らせ下さい
・現在の年月日と別ファイルに用意したデータを参照し、下記の文章をwrite(★~★は変数)(☆曜日は月日から算出)

★月1★/★日1★(☆曜日)★txt1★(任意文字列)★月2★/★日2★(☆曜日:★月1★=12月かつ★月2★=1月の場合、年越しさせてください)

実際の出力例)
04/24(金) AM9:00(任意文字列)04/28(火)
※1~9月・1~9日の頭の0は必要

----
残りはコメントに記述します。。。。

回答の条件
  • 1人3回まで
  • 登録:2009/04/22 10:26:00
  • 終了:2009/04/24 14:26:21

ベストアンサー

id:Mars No.1

Mars回答回数203ベストアンサー獲得回数202009/04/22 14:56:29

ポイント500pt

・jQueryを使っています。(入手先 http://jquery.com/

・このスクリプトはid="result"のリストに <li>結果</li> を書き足します。

(スクリプト後半の'<li>'や'</li>'の部分を変えればリスト以外の場所に書き出す事もできます)

・データの最初の二つ、現在の月,現在の日 は何かわからなかったので使っていません。

(データファイル上はあるものとして処理してます。参照してないだけ。)

・データに「年」の必要性を感じたので、現在の日と月1の間に年を書く事にしています。

・時刻は24h制のようでしたので、AM/PMは都合もあってスクリプト内で自動で付けることにしました。


--- HTML(head内) ---
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="example.js"></script>

--- HTML(body内) ---
<ul id="result"></ul>

--- examle.js ---
$(function(){
	var J = {
		filename : 'example.txt',
		text : '任意文字列',
		resultElement:'#result',
		data : new Array()
	};

	jQuery.get( J.filename ,{},
		function(textdata){
			jQuery.each(textdata.split('\n'),
				function(i,val){
					val=val.replace(/\s+/,'');
					var getYobi = function(w){return(['日','月','火','水','木','金','土'][w])};
					J.data[i] = val.split(',');
					if(J.data[i].length < 2)return;
					var tD = new Date(J.data[i][2]+'/'+J.data[i][3]+'/'+J.data[i][4]);
					J.data[i].push(getYobi(tD.getDay()));
					tD = new Date(((J.data[i][3]==12 &&J.data[i][6]==1)?parseInt(J.data[i][2])+1:J.data[i][2]) +
						'/'+J.data[i][6]+'/'+J.data[i][7]);
					J.data[i].push(getYobi(tD.getDay()));
					jQuery.each(['3','4','6','7'],
						function(x,val){
							if(J.data[i][val] < 10) J.data[i][val] = '0'+J.data[i][val];
						}
					);
					var tT = J.data[i][5].split(':')[0];
					J.data[i][5] = ((tT < 12)?'AM':'PM') + ((tT<10)?'0':'') + J.data[i][5];

					$(J.resultElement).append(
						'<li>'+
						J.data[i][3]+'/'+
						J.data[i][4]+'('+J.data[i][8]+') '+
						J.data[i][5]+'('+J.text+')'+
						J.data[i][6]+'/'+
						J.data[i][7]+'('+J.data[i][9]+')'+
						'</li>'
					);
				}

			);
		}
	);
});

--- examle.txt(テストしたデータ) ---
4,20,2009,4,24,9:00,4,28
4,22,2009,4,29,9:00,4,30
4,24,2009,4,29,9:00,5,1
4,25,2009,4,29,18:00,5,1
4,27,2009,5,6,9:00,5,8
4,26,2009,12,6,9:00,1,8

--- 結果(実行後のHTML) ---
<ul id="result">
<li>04/24(金) AM09:00(任意文字列)04/28(火)</li>
<li>04/29(水) AM09:00(任意文字列)04/30(木)</li>
<li>04/29(水) AM09:00(任意文字列)05/01(金)</li>
<li>04/29(水) PM18:00(任意文字列)05/01(金)</li>
<li>05/06(水) AM09:00(任意文字列)05/08(金)</li>
<li>12/06(日) AM09:00(任意文字列)01/08(金)</li>
</ul>

何か不都合とかあれば後はコメントの方で。

id:naleringar

調整いただきありがとうございます。

PC時計を色々ずらしたり、サーバー上に置いて閲覧してみたりして、動作をおおむね確認し、だいたい大丈夫そうです(タブでインデントしようとして、どことどこのカッコがくっついてるのか真剣に悩むレベルなので本当に助かります)

2009/04/24 14:14:41
  • id:naleringar
    ----
    【別ファイルに用意したい内容】

    例)hogelist.(js 又は txt)
    ※現在の月,現在の日,★月1★,★日1★,★txt1★,★月2★,★日2★
    ※年等、必要行・列あれば追加してください

    4,20,4,24,AM9:00,4,28
    4,21,4,24,AM9:00,4,28
    4,22,4,29,AM9:00,4,30
    4,23,4,29,AM9:00,4,30
    4,24,4,29,AM9:00,5,1
    4,25,4,29,PM18:00,5,1
    4,26,5,6,AM9:00,5,8
    4,27,5,6,AM9:00,5,8
    4,28,5,6,AM9:00,5,8
    4,29,5,6,AM9:00,5,8
    4,30,5,6,AM9:00,5,8
    5,1,5,6,AM9:00,5,8
    5,2,5,6,AM9:00,5,8
    ※以下、下に追記していき、上の不要行は随時削除したい
  • id:naleringar
    またもやお世話になります。私の質問に不備がありましてすみません。次回から気をつけます。

    「こんなふうになってほしい」を追記します。どうぞよろしくお願いいたします。

    【意図】

    結果の文字列はこんなふうになってほしいのです(出力はシンプルなテキストのみで良いです)

    例)もし、今日(参照PCの日付?設置サーバーの日付?)が2009/4/23だったら、



    04/29(水) AM09:0(までにhogehoge...)04/30(木)

    例)もし、今日(参照PCの日付?設置サーバーの日付?)が2009/5/1だったら、



    05/6(水) AM09:0(までにhogehoge...)05/08(金)
  • id:Mars
    データ全部じゃなくて、中から1件だけを探して表示なんですね。

    ちなみに、
    (1)4/29 09:00 ~ 4/30
    (2)5/6 09:00 ~ 5/8
    ってデータがあったとき、
    期間中の 4/29 09:00 ~ 4/30 23:59に見た時表示するのは(1)ですか。
    それとも、(2)の表示ですか?

    なお、判定には参照PCの時計を使います。(サーバの時刻はJavascriptだけでは取れないので)
  • id:naleringar
    ご返信ありがとうございます。本当に説明不足でお手数をおかけします。よろしくお願いいたします。

    >(1)4/29 09:00 ~ 4/30
    >(2)5/6 09:00 ~ 5/8
    >ってデータがあったとき、

    ここで、現在の月,現在の日を使いたいのです。→参照PCの時計=現在の月,現在の日

    (現在が4/22の場合)は、下記のうち(1)が戻って?きて、
    (現在が4/26の場合)は、下記のうち(3)が戻ってくる…

    (1)4/22 , 4/29 09:00 ~ 4/30
    (2)4/25 , 4/29 18:00 ~ 5/1
    (3)4/26 , 5/6 09:00 ~ 5/8

    データの内容については、【現在の月,現在の日はいつも日付の古い方から並んでいる(昇順?)】予定です。
  • id:Mars
    わかってきたかも・・・
    参照PCの時計が4/21なら(1)
    参照PCの時計が4/22なら(1)
    参照PCの時計が4/23なら(2)
    参照PCの時計が4/24なら(2)
    参照PCの時計が4/25なら(2)
    参照PCの時計が4/26なら(3)
    で、あってますか?
  • id:naleringar
    参照PCの時計(現在の月,現在の日)と、
    ★月1★,★日1★,★txt1★,★月2★,★日2★

    は、1対1の関係が望ましいです(臨時で変動したりするので=パターンがない)
    よって、最初のコメント欄の内容で表現した場合、

    参照PCの時計が4/21なら4/24 09:00 ~ 4/28
    参照PCの時計が4/22なら4/29 09:00 ~ 4/30
    参照PCの時計が4/24なら4/29 09:00 ~ 5/1
    参照PCの時計が4/25なら4/29 18:00 ~ 5/1
    参照PCの時計が4/26なら5/6 09:00 ~ 5/8

    というふうにできますでしょうか?

    どうぞよろしくお願いいたします。
  • id:Mars
    わかりましたー。
    (PCの時計に合致するデータがない場合は、直近のデータを探すよりもなにも表示しないほうがいいですね?)

    あと、いまさらですがよく見ると
    PM18:00 って変です。
    24h制ならAMやPMは付けないし、
    12h制なら PM06:00 とするべきだと思います。
    どうしますか?(そういう表現に馴染みがあるのなら別ですが)
  • id:naleringar
    お手数をおかけいたします

    >(PCの時計に合致するデータがない場合は、直近のデータを探すよりもなにも表示しないほうが)

    なにも表示しない、で大丈夫です
    (データはエクセル等作成し、なるべく漏れなく準備するつもりです)

    12h制で表示する、にてお願いします。
    また、その場合に準備する時刻データのフォーマットをご指示いただけると助かります。
    (表示は12h制だけどデータは24h制にしてね、等)

    どうぞよろしくお願いいたします。
  • id:Mars
    今までの内容で修正したのが以下です。

    データファイルの内容にはやっぱり「年」は不要としたのでほぼ最初のコメント通りです。
    (時刻の部分は24h制で書いてください)

    例 4,25,4,29,18:00,5,1
    例 4/24,4/29,9:00,5/1
    (区切りは「,」、「/」どっちでも同じ。見易い/打ち込み易い方で)

    結果は id="result" の要素に埋め込みます。
    <任意 id="result"></任意>


    --- example.js ---
    $(function(){
    var J = {
    filename : 'example.txt', // 読み込むファイル名
    text : '任意文字列', // 途中に埋め込むテキスト
    resultElement:'#result' // 結果を埋め込む対象
    };

    jQuery.get( J.filename ,{},
    function(textdata){
    var tD0 = new Date();
    var tD0_m = tD0.getMonth()+1;
    var tD0_d = tD0.getDate();
    var _yobi = function(w){return(['日','月','火','水','木','金','土'][w])};
    jQuery.each(textdata.split('\n'),
    function(i,val){
    var data =val.replace(/\s+/,'');
    data = val.split(/\D/);
    if(data.length < 7)return true;
    if(data[0] != tD0_m || data[1] != tD0_d) return true;

    var tD1 = new Date(tD0.getFullYear()+'/'+data[2]+'/'+data[3]);
    var tY = tD0.getFullYear()+ ((data[2]==12 && data[6]==1)?1:0);
    var tD2 = new Date( tY + '/'+data[6]+'/'+data[7] );
    if(data[4]>11){
    var ampm='PM';
    data[4] =''+(data[4]-12);
    } else {
    var ampm='AM';
    }
    for(var x=2;x<8;x++)
    if(data[x] < 10 && data[x].length<2) data[x] = '0'+data[x];

    $(J.resultElement).append(
    data[2]+'/'+data[3]+'('+ _yobi(tD1.getDay())+') '+
    ampm+data[4]+':'+data[5]+
    '('+J.text+')'+
    data[6]+'/'+data[7]+'('+_yobi(tD2.getDay())+')'
    );
    return false;
    }
    );
    }
    );
    });
  • id:Mars
    >タブでインデントしようとして
    コメントの方でははてな記法が使えないようなんですよね。
    回答に書くと開封ポイントが必要になっちゃうし・・・悩ましいです。
  • id:naleringar
    2回答になっても、合計で500ptお渡しできるよう終了させるのでたぶん大丈夫だったりします。
    とりあえず今ソースは頑張って(後で)解読してみます。。。。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません