現在、連番を振った画像を格納し表示すると言った処理を作成したのですが
画像が無い場合が存在し、その場合の対処を考えています。
画像が無かった場合と言うのは拾えるのでしょうか?
無理ならば無理と言うことでもかまいませんので、
ご存知の方いらっしゃいましたらよろしくお願いします。

A 回答 (1件)

kentayosといいます。

どうぞよろしく。
早速ですが、方法について書きます。

まず大きく分けて2つの場合が考えられると思います。
(1)どの番号のファイルが存在しないのかわかっている場合。
(2)どの番号のファイルが存在しないのかわからない場合。
の2つです。

(1)この場合は簡単です。スクリプト内にあらかじめ、
------------------------------------------------
if(!(n==1 || n==3 || n==7)) {
   ・
   ・
   ・
}
------------------------------------------------
などのように、ファイルがない番号をif文などで指定しておけば
そのファイル番号の部分が除かれます。



(2)この場合には2つほど方法があります。

(2)-1
------------------------------------------------
<img src="xx.jpg" onError="shippai()">
------------------------------------------------
このように画像のイベントハンドラに「onError」を指定しておき、
ヘッダー部分に shippai()などのように関数で処理を記述しておく方法です。
ただしこれだと、画像を実際に読み込んでみてダメだった場合の処理に
なってしまいますので、あまりお勧めできません。


(2)-2
------------------------------------------------
gazou=new Array();
for(i=1;i<=20;i++) {
  gazou[i]=new Image();
  gazou[i].src="xxx"+i+".jpg";
}
n=1;
function gazou_kirikae() {
  fsize=gazou[n].fileSize; // ファイルサイズを取得
  if(fsize != "-1") {
    ・
    ・
    ・
  }
  if(n==20) n=1; else n++; // 20までいったら1に戻す。
}
------------------------------------------------
<body onLoad="setIntereval('gazou_kirikae()',1000)">
------------------------------------------------
このような感じで、ファイルサイズを使って使います。
gazou[n].fileSize で現在表示させようとしている画像のファイルサイズを得ます。もしきちんと画像が存在すれば、fsize には数値が格納されますが、もし画像ファイルが存在しない場合は "-1" が格納されます。これを利用して、fsizeが-1の場合を除いて画像を表示させる処理をさせれば、画像が場合分けが可能です。
    • good
    • 0
この回答へのお礼

kentayosさんお返事ありがとうございました。
なるほど~ファイルサイズを使用すれば良いんですね。
自分ではどうして良いのか全く分からなかったので
とても、参考になりました本当にどうもありがとうございました。

お礼日時:2002/02/28 09:12

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

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QJavaScriptがoffならば、ページを表示しない。

JavaScriptがoffならば、ページを表示しない。

というのは可能なんでしょうか?
すべてをdocument.writeで書けばいいのでしょうが、
PHPで動的に、ページを作っているので、できるだけ
シンプルな方がいいのです。

別のページに飛ばすと言うのでもかまいません。
一応、JavaScriptでリンク元のページを開くようにして
ダブルチェックの意味合いもあるのですが。

Aベストアンサー

表示しない、というのがスタイルによる未表示でいいなら。


<style type="text/css" id="CSS1">
body *{display:none;}
noscript{display:block;}
</style>
<script type="text/javascript">
document.getElementById('CSS1').disabled = true;
</script>

<body>
~~
<noscript>javascript on にしてね</noscript>
</body>

Q画像集、小画像をクリックすると大画像を中央表示するには?

画像集を作ってるのですが、
テーブルの中に小さな画像の一覧があり、
クリックするとその大きな画像が表示され、
なおかつページの真ん中に表示されるものを作成中です。

自分が思うに、width=100% height=100%
のテーブルの中に画像リストのテーブルを入れ
テーブル名を table とするなら、
そこにある小さな画像を onclick すると

document.table.location.href = picture;

または

document.table.src = picture;

のようなイメージでテーブルと大画像を置き換えれば
できると思うのですが、うまくいきません。
なにかアドバイスありますでしょうか?

もちろん 写真ごとにセンター寄せの web page を作り
普通にリンクという方法もありますが、写真が増えると
あまり効率が良いとは言えず。。。

Aベストアンサー

<script>
//拡大画像を表示する
function pwinOpen(imgSrc){
var lgPhoto=document.getElementById('lPhoto');
lgPhoto.src = imgSrc;
var pWin=document.getElementById('pWindow');
pWin.style.visibility = 'visible';
}

//拡大画像を閉じる
function cls(){
var pWin=document.getElementById('pWindow');
pWin.style.visibility = 'hidden';
var lgPhoto=document.getElementById('lPhoto');
}
<body >
<!-------------ここから----------------->
<div id="pWindow" style="position:absolute; visibility:hidden; width:100%; height:100%;">
<table style="width:100%; height:100%;" border="1" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="middle">
<table style=" background-color:#FFF; border:1px solid #000;" border="1" cellspacing="15" cellpadding="0">
<tr>
<td align="center" valign="middle"><a href="#"><img src="" OnClick="cls()" id="lPhoto"></a></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!-------------ここまで----------------->
<table style="width:100%; height:100%;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="middle">
<table border="1" cellspacing="0" cellpadding="0" style="background-color:#F3F5FD; border:1px solid #666;">
<tr>
<td><a href="#" onFocus="this.blur()"><img src="" OnMouseOver="pwinOpen('01.jpg')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('21.jpg')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('02.jpg')" width="100" height="50" border="0"></a></td>
</tr>
<tr>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
</tr>
<tr>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
<td><a href="#" onFocus="this.blur()"><img src="" OnClick="pwinOpen('')" width="100" height="50" border="0"></a></td>
</tr>
</table>
</td>
</tr>
</table>

<script>
//拡大画像を表示する
function pwinOpen(imgSrc){
var lgPhoto=document.getElementById('lPhoto');
lgPhoto.src = imgSrc;
var pWin=document.getElementById('pWindow');
pWin.style.visibility = 'visible';
}

//拡大画像を閉じる
function cls(){
var pWin=document.getElementById('pWindow');
pWin.style.visibility = 'hidden';
var lgPhoto=document.getElementById('lPhoto');
}
<body >
<!-------------ここから----------------->
<div id="pWindow" style="position:abs...続きを読む

Q始めに読み込む画像を固定して、画像クリックで複数登録してある画像にラン

始めに読み込む画像を固定して、画像クリックで複数登録してある画像にランダムで切り替える方法

当方HTML+CSSは習得していますがJAVAの知識は殆どありません。

ページ内で画像を使った占いのようなコンテンツを作りたいのですが、画像ランダム切り替えのスクリプトにページをリロードしたときにしか表示されない扉画像を付けたいのと思っています。扉画像ををクリックすると「占い結果」画像が表示される、といった具合です。また、「占い結果」画像をさらにクリックすることでまた別画像に切り替えるようにしたいのですが、どなたか教えてください。

Aベストアンサー

サンプルです。(画像切り替えにアニメーション効果付けてます。)

HTML-ヘッダ内
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="sample.js"></script>

HTML-BODY内(imgにidを付けておく)
<img src="扉絵のURI" id="fortune" alt="" width="~" height="~">

sample.js
$(function(){
var imglist = new Array(
'画像AのURI',
'画像BのURI',
~略~
'画像XのURI'
);
var fadeOutTime = 200; // 単位:ミリ秒
var fadeInTime = 600; // 単位:ミリ秒

for(var i=0;imglist[i];i++) $('<img src="'+imglist[i]+'">');
$('#fortune').click(function(){
var no = Math.floor( Math.random() * (imglist.length));
$(this).animate({opacity:0.1},fadeOutTime,function(){
$(this).attr('src',imglist[no])
.animate({opacity:1},fadeInTime);
});
});
});

サンプルです。(画像切り替えにアニメーション効果付けてます。)

HTML-ヘッダ内
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="sample.js"></script>

HTML-BODY内(imgにidを付けておく)
<img src="扉絵のURI" id="fortune" alt="" width="~" height="~">

sample.js
$(function(){
var imglist = new Array(
'画像AのURI',
'画像BのURI',
~略~
'画像XのURI'
);
var fadeOutTime = 200; // 単...続きを読む

Q配列の格納

現在、PHPで生成したhiddenフィールドに、Valueを設定しない記述(配列のような形式)を行い、JavaScriptにて値を代入するプログラムを作っています。
エラーは出ていないようなのですが、値が代入されません。Alertでみると、undefinedというメッセージが出ています。hiddenフィールドへの格納方法をご教授ください。

<ソース>(抄)
function user_num() {
var i=1,l=0, num = document.getElementById('users').length;
document.user_select.user_no =new Array(num);
while(num > 0){
document.getElementsByName('user_no[i]').value = document.getElementById('users').options[l].value;

alert(document.getElementsByName('user_no[i]').value);
num--;
i++;
l++;
}
}
(中略)
hiddenフィールド生成文

<?php
$n=1;
while($i){
print '<input type="hidden" name="user_no[';
print $n;
print ']"';
print ' id="user_no[';
print $n;
print ']">';
$i=$i-1;
$n=$n+1;
}
?>

現在、PHPで生成したhiddenフィールドに、Valueを設定しない記述(配列のような形式)を行い、JavaScriptにて値を代入するプログラムを作っています。
エラーは出ていないようなのですが、値が代入されません。Alertでみると、undefinedというメッセージが出ています。hiddenフィールドへの格納方法をご教授ください。

<ソース>(抄)
function user_num() {
var i=1,l=0, num = document.getElementById('users').length;
document.user_select.user_no =new Array(num);
while(num > 0){
document.ge...続きを読む

Aベストアンサー

#1です。
サンプルは動いた。うまくはいきません。ではどうしたらいいのかサッパリわからないです。

(それを配列と呼ぶかどうかはわかりませんが)nameとvalueが設定されたinputがform配下にあればformの送信時に送られるハズなんですけどね~。

それとも送信ではなく受け取り側(次のページ)に問題があるのでしょうか?(送信できたかどうかはformのmethodをgetにしておけば簡単に確認できますが)

とりあえずサンプルが動いたことで続きを自分で解決するなら質問を終了する、そうでなければ第三者がわかるような情報を捕捉するかしてくださいませ。

Qデータベースからのarray を javascript に格納する方法

行き詰っているので、力を貸してください。あるプロダクトの名前、ID、及び値段をデータベースからPERL DBIで引っ張ってきています。
<option value="id">$name</option>という形になっています。
同じページの同じフォームにたくさんあるオプションの中からある名前を選ぶと、値段をテキストボックスでonCheck で表示させたいのですが、データベースからとってきた配列はフォームの中のwhile文の中に入っているため、どうやって、<header>の間のjavascript の配列に入れることができるのでしょうか?
スクリプトは下記の通りです。

PERL/DBI form名:mbscalcTb

my $sql = "SELECT ProductId,.NameJ,.PSJ from Security";
my $sth = $dbh->prepare($sql); $sth->execute(); my $row;
while ( $row = $sth->fetchrow_hashref() ) {
my ( $ProductId, $NameJ, $psjtb ) = ( $row->{ProductId},$row->{NameJ},$row->{PSJ} );
print "<option value=$ProductId name=\"pid\" onmouseup=\"get_psj()\">$NameJ$psjtb</option>";
print "<tr><td><input type="text" name="price"></tr></td>";
}
なんとなく、やりたいjavascript

知りたいこと:var productId_list array の中にどうやれば、
カンマの区切り入りで上の$row->{PSJ} を入れることができるのか??

function get_price () {
var productId_list = [ $ProductId];
var psj_list = [ $psj ];
var pid = document.mbscalcTb.pid.value;
for (var i =0; i < productIdlist.length; i++) {
if (productId_list[i] == pid ) {
return psj_list[i];
document.mbscalcTb.price.value= psj_list[i];}
}
また、他にもっといい方法があれば教えてください。宜しくお願いします。

行き詰っているので、力を貸してください。あるプロダクトの名前、ID、及び値段をデータベースからPERL DBIで引っ張ってきています。
<option value="id">$name</option>という形になっています。
同じページの同じフォームにたくさんあるオプションの中からある名前を選ぶと、値段をテキストボックスでonCheck で表示させたいのですが、データベースからとってきた配列はフォームの中のwhile文の中に入っているため、どうやって、<header>の間のjavascript の配列に入れることができるのでしょうか?
スクリ...続きを読む

Aベストアンサー

なぜheaderに参照した値を入れる必要があるのか
わかりませんが、やるなら参照処理と表示処理を
分けるだけでよいのでは?
フロー的にはこんな感じで。

<?PHP
・・・
while(sql指定){
$script_str.="ほげほげ";
$option_str.="<option>ほげ";
}
・・・

print <<<eof;
<html>
<head>
<script language=javascript>
function hoge(obj){
・・・
$script_str
}
</script>
</head>
<body>
・・・
<form>
<select onChange="hoge(this)">
$option_str
</select>
</form>
・・・
</body>
</html>
eof;
?>


人気Q&Aランキング

おすすめ情報