【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?

こんにちは、Javascriptに対して理解が浅く、まだ、全然使いこなせない者です。どうか教えてください。

ブラウザを更新するごとに、ランダムに文字が表示されるページがあります。
いろいろな文字が出てきますが、例えば、表示されたページ内に「たぬきそばが食べたい!」という文字が表示されたり、「最近そばかすが増えてきた!」というように、「そば」という文字が出てきた場合だけ、メッセージボックスで「そばがでました!」と警告したいのですが、どうしたらよいのかわかりません。

よろしくお願いします。

A 回答 (2件)

No.1です。

ランダムに、というのはJavascript側でランダムに
文章を出すのではなく、JSPなり何なりで取得してきたページに
対して特定の文字列が含まれているかどうかを取得する。
…という意味で受け取って良いでしょうか?

ページ内で所定の文字を検索させる機能については、
下記ページが参考になると思います。

■ページ内検索機能をつける
http://computer.shipweb.jp/soft/pageinserch.htm

表示されてから○秒後にファンクションを実行する場合、
タイマーを使います。下記ページが参考になります。

■タイマーを作る
http://www.geocities.jp/miyake_kobo/js/koubun_00 …


上記リンク先のスクリプトを組み合わせて、ちょっと改良して
以下のようなコードを作成してみました。
-------------------------------------------------------
<html>
<head>
<title>検索タイマー</title>
<script langage="javascript">
<!--
var serchindex=0;
var serchcounter=0;
var serchstr = "";
var serchwordcounter=0;
var start=0;

// タイマーセット
function setTimer(keyword)
{
// 2000ミリ秒後に検索処理を実行
var ref=setTimeout("wordserch('" + keyword + "')",2000);
}

// 文字列検索メイン
function wordserch(keyword)
{
if(serchstr != keyword){serchindex=0;serchwordcounter=0;}
serchstr = keyword;
var bCrumb = new Array();
var i;
while(serchstr.indexOf(' ')>=0){serchstr = serchstr.replace(" "," ");}
while(serchstr.indexOf('|')>=0){serchstr = serchstr.replace("|"," ");}
while(serchstr.indexOf('&')>=0){serchstr = serchstr.replace("&"," ");}
bCrumb=serchstr.split(" ");
for(i=serchwordcounter;i<bCrumb.length;i++)
{
serchstring = bCrumb[i];
serchcounter++;
ref=serch(serchstring);
if(!ref && start>=0)
{
alert('[' + keyword + ']がありました。');
return;
}
if(ref==true && start>=0)
{
alert('[' + keyword + ']がありました。');
return;
}
else
{
serchwordcounter++;
serchindex=0;
}
}
}

// 検索
function serch(txt,index){
var before,txt,after,objstr;kazu=0;
var serchstr=txt;
objct = document.getElementById('UR');
str = objct.innerHTML;
start = str.indexOf(serchstr,serchindex);
if(start>0)
{
return true;
}
else
{
return false;
}
}
//-->
</script>
</head>
<body onload="setTimer('検索対象')">
<DIV ID="UR">
ここに検索対象となる文章を記述します。検索結果があれば良いですね。
</DIV>
</body>
</html>
-------------------------------------------------------

詳細はリンク先を参照下さい。このサンプルでは
プログラムの実行はbodyタグのonloadで指定しています。

<body onload="setTimer('検索対象')">
この文字列が、『そば』等の検索ワードになります。
サンプルではベタ書きしていますが、サーバーサイトで自由に
可変させると実際の実装には良いですね。

setTimerファンクションが実行されると、指定した時間後に
指定したファンクションを実行することを設定します。
サンプルでは2000ミリ秒(2秒)後にwordserch()を実行、
引数として検索ワードをそのまま渡しています。

wordserch()では検索ワードを受け取り、検索処理を実行します。
<DIV ID="UR">~</DIV>で囲んだ範囲内が検索対象になるので、
JSP等で動的なページを生成する際はこの範囲内にコンテンツが
出力されるように設定しましょう。サンプルではベタですが。

これでページ読み込み後から指定時間後に、コンテンツに
指定した文字があるときにのみ処理を行うことができますね。
    • good
    • 0
この回答へのお礼

Splatterさん、最後まで面倒を見てくれてありがとうございました!
完璧です!感激です!これが欲しかった!
この結果を得るために、すごい頭と時間を使ってきたので、本当に助かりました。
遅くなりましたが、御礼申し上げます。

お礼日時:2009/03/03 11:24

何がやりたいのかよく分かりませんが、とりあえず


質問の通りに作ってみたので実行願います。
-------------------------------------------------------
<html>
<head>
<title>ランダムな文字列を表示する</title>
</head>
<body>
<script langage="javascript">
<!--

// メッセージ配列
msg = new Array();

// メッセージ配列にデータをセット
msg[0] = "たぬきそばが食べたい!";
msg[1] = "にしんそばが食べたい!";
msg[2] = "カレーうどんが食べたい!";
msg[3] = "最近そばかすが増えてきた!";
msg[4] = "米さえあれば、それでいい!";
msg[5] = "カップラーメンが一番!";
msg[6] = "だからそばかすが増えるんだよ!";
msg[7] = "関係あるのかい、それ?";
msg[8] = "お前ら炭水化物ばっかりだね。";
msg[9] = "以降は追加して下さい。";

// 配列の個数内でランダム値を作成する
var i = Math.floor(Math.random()*msg.length);

// 作成した番号のメッセージを表示する
document.write("今日の一言:<font color = red>" + msg[i] + "</font>");

// 作成した番号のメッセージが"そば"を含む場合
if (msg[i].indexOf("そば",0) != -1)
{
// ダイアログを表示する
alert("そばが見つかりました。");
}

//-->
</script>
<hr>
テストページです。Javascriptを有効にし、
更新ボタンでリフレッシュして下さい。
</body>
</html>
-------------------------------------------------------

まずメッセージを配列に定義し、配列の個数の範囲内で
ランダムな数字を作成します。配列から、作成した番号の
メッセージを取り出して画面に表示させます。

また、その表示されたメッセージが特定の文字列を1つでも
含んでいるかを判断し、1個以上あればダイアログで
メッセージを表示させる、という流れです。

この回答への補足

Splatterさんありがとうございます。
配列に入れた追加のオリジナルメッセージ面白いですね!
(個人的に好きなセンスです!)

さて、本題なのですが・・・。
スミマセン。質問の文章が至らなかったです。

ワケあって、ランダムに表示される文字の内容を事前に知ることが出来ない環境・・・。
つまり、一旦表示されたページを0.5秒くらい見てから、自動的にページ内に「そば」という文字が有るか無いかを判断するという、ちょっと変わったプログラムを探しています。

質問下手ですみません。

補足日時:2009/03/02 13:25
    • good
    • 0

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