正規表現について教えてください。

締切済

質問者：toutetsu
質問日時：2007/09/26 00:35
回答数：1件

正規表現について教えてください。以下は左に配置したサムネイル（X01s、X01as、X01bs・・・）をクリックすると右にそのサムネイルの拡大画像（X01l、X01al、X01bl・・・）を表示するページです。

サムネイルのimgタグを▼以下のようにしたいと考えています。
※makethumbnail.cgiはサムネイル作成CGI
現在：<img src="X01s.jpg">
変更後：<img src="/makethumbnail?src=X01s.jpg&w=100&h=&type=">

▼以下はダメでした。正規表現に問題があるのでしょうか。
<img src="/makethumbnail.cgi?src=' + img + 's' + ext + '&w=100&h=&type=" class="thumbnail" onclick="changeImage(this)">

お知恵をお借りできれば幸いです。

<head>
<script type="text/javascript">

location.search.match(/^\?img=([^&]+)(\.[^&\.]+)&num=(.+)$/);
var img = RegExp.$1;
var ext = RegExp.$2;
var num = Number(RegExp.$3);

function changeImage(img){
var imgsrc = img.src || img;
imgsrc.match(/^(.*)s(\.[^\.]+)$/);
document.main.src = RegExp.$1 + "l" + RegExp.$2;
return false;
}

document.write = img && ext && num ? document.write : function(){};

</script>
</head>

<body>
<table>
<tr>
<th>
<script type="text/javascript">

/* サムネイル */
document.write('<a href="#"><img src="' + img + 's' + ext + '" class="thumbnail" onclick="changeImage(this)"></a><br /><br />');

for (var i = 1; i < num; i++) {
document.write('<a href="#"><img src="' + img + String.fromCharCode(0x60 + i) + 's' + ext + '" class="thumbnail"
onclick="changeImage(this)"></a><br><br>');
}

</script>
</td>
<td>
<script type="text/javascript">

/* 拡大 */
document.write('<img src="' + img + 'l' + ext + '" name="main" id="main_image" />');

</script>
</td>
</tr></table>

通報する

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

質問の本文を隠す

回答 (1件)

最新から表示
回答順に表示

No.1

回答者： irija_bari
回答日時：2007/09/26 16:02

正規表現は使っていませんが。

。。というか正規表現を使う必要がないと思います。
私なら以下のように記述します。

デバッグしていませんのでミスがあるかと思います。
また、<img>タグの属性なども付けていませんのできちんと付けるべきでしょう。

==== javascript - HEADER ====
function changeImage(img){
if(img==0){
large_image.src = "X01l.jpg";
}else{
large_image.src = "X01" + String.fromCharCode(0x60 + img) + "s.jpg";
}
}
==== end of javascript - HEADER ====

==== javascript - thumbnail ====
for(var i=0; i<num; i++){
if(i==0){
document.write('<a href="javascript:changeImage(' + i + ')"><img src="X01s.jpg"></a><br>');
}else{
document.write('<a href="javascript:changeImage(' + i + ')"><img src="X01' + String.fromCharCode(0x60 + i) + 's.jpg"></a><br>');
}
}
==== end of javascript - thumbnail ====

==== HTML - Large Image ====
<img name="large_image" src="X01l.jpg">
==== end of HTML - Large Image ====

この回答への補足

ご回答ありがとうございます。
ただ残念ながら私の説明不足のせいか回答がまったく意図していることと異なっているようです。
また文字制限があるためコードは不要と思われるところは省いています。
そのせいかもしれません。

質問は記載したページ自体が動作する/しないということではなく、サムネイル自動作成CGI（makethumbnail.cgi）を追加してサムネイルのimgタグを▼以下のようにしたいということです。
ページ自体は問題なく動作していますのでmakethumbnail.cgiを追加するにはどうすればよいかということだけです。
※X01sは仮に入れています。
※makethumbnail.cgiは以下のようにmakethumbnail.cgiのあとに画像のURLをサイズを記載することでImageMagicを利用して画像を小さくします。
現在：<img src="X01s.jpg">
変更後：<img src="/makethumbnail.cgi?src=X01s.jpg&w=100&h=&type=">

記載のページは、あるページ（ページXとします）である画像（画像Aとします）をクリックすると新しいウインドウを開き、画像Aを様々な角度から撮ったものをサムネイルと拡大画像で見せるものです。

正規表現を用いているのは画像Aの名前がX01だったり、A02だったり、B04だったりするからです。
ただ画像Aにはルールがあり、X01のサムネイルはX01s、拡大画像は：X01l、角度の異なる拡大写真はX01al、X01bl、X01clというようにアルファベットで連番となっています。

記載のページとスクリプトは▼以前にこちらで質問したときに回答をいただいたものです。
http://oshiete1.goo.ne.jp/qa1618358.html

以上でもし何かお分かりになればご指摘いただければ幸いです。