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

JavaScriptクリックした画像を変えたいです。

解決済

  • 質問者：webschool
  • 質問日時：
  • 回答数：3件

JavaScriptで一度画像をクリックすると画像が変わりそのご画像をクリック
できないようにするにはどうしたら良いでしょうか？

A画像をクリックするとB画像に代わりB画像はクリック出来ないように
なります。

どうぞよろしくお願いします。

通報する

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

質問の本文を隠す

A 回答 (3件)

No.3ベストアンサー

  • 回答者： oka5130
  • 回答日時：

こんな感じでいかがでしょう。



<html>
<head>
<script type="text/javascript"><!--
function clickImg( img ) {
var arraySrc = img.src.split( '/' );
var src = arraySrc[arraySrc.length - 1];
if( src == "a.jpg" )
{
document.cookie = "click=1;";
img.src = "b.jpg";
img.style.cursor = "default";
}
}
function init() {
if( document.cookie )
{
var img = document.getElementById( "img1" );
document.getElementById( "img1" ).src = "b.jpg";
img.style.cursor = "default";
}
}
//--></script>
</head>
<body onload="init();">
<img src="a.jpg" id="img1" style="cursor:pointer;" onclick="clickImg(this);" />
</body>
</html>
    • good
    • 0
    • 件
通報する
この回答へのお礼

oka5130さん
出来ました！！本当にありがとうございます。
こんなに教えて頂きなんとお礼を申したらよいのか
ありがとうございます。
今後勉強に精進したいと思います。

本当にありがとうございました。

通報する
お礼日時：2008/06/18 10:46

No.2

  • 回答者： oka5130
  • 回答日時：

a.jpgをクリックしたことをクッキーに書き込んでおいて、


ページが読み込まれる時にクッキーを読み込んでチェックすれば実現可能です。

a.jpgをクリックした時（onclick）に
document.cookie = "click=1;"
と書いてクッキーにクリックされたことを書き込んでおいて、
ページを読み込んだ時に
if( document.cookie ) {
// 画像のsrc属性の値をb.jpgにする
}
が実行されるようにしておけばとりあえず動くと思います。

「とりあえず」というのは、本来ならクッキー名が"click"の値が"1"かどうかを判定するif文を書くべきですが、
面倒なので上記のようにしました。
クッキーに他の情報も書き込んだりする場合は、きっちり書かなくてはなりません。

クッキーの読み書きについては以下のサイトをご覧下さい。
http://www016.upp.so-net.ne.jp/masuda2/js/js011. …
    • good
    • 0
    • 件
通報する
この回答へのお礼

ご回答ありがとうございます。
この方法でできると思います。ただ試してみましたがうまくいきませんでした。

こちらの知識不足ですみませんがどのように記述すれば動くかを教えて頂けないでしょうか。
宜しくお願いします。

通報する
お礼日時：2008/06/11 23:21

No.1

  • 回答者： xitoaki
  • 回答日時：

<img src="a.jpg" onClick="JavaScript:this.src='b.jpg';">



でしょうか。
(面倒なのでタグ内にスクリプトを記述していますが…)

クリックするたびにb.jpgが呼び出されるのが嫌であれば、
条件文
if(this.src=='a.jpg')
を入れればいいでしょう。
カーソルも変えたければ、
<img src="a.jpg" style="cousor:pointer;"
onClick="JavaScript:
if(this.src=='a.jpg')
{
this.src='b.jpg';
this.style.sursor=default;
}
">

といった感じでしょうか。
動作確認していないので、thisあたりの記述が違うかもしれませんが
こんな感じでしょう。
    • good
    • 0
    • 件
通報する
この回答へのお礼

こちらをやりたいと思っていました。
ありがとうございます！

ご質問ですがa.jpgをクリックしてb.jpgに切り替わりクリック
できないようになるまでは良いのですが、

ブラウザーを更新したり他のページから戻ってくると再度a.jpgが
現れないでb.jpgのままにするにはどうしたら良いでしょうか？

つまり一度クリックした画像がブラウザーを更新してもこの画像は
クリックしていますよ、ということが分るようにしたいと思います。

宜しくお願いします。

通報する
お礼日時：2008/06/05 14:03

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

Q質問する（無料）

関連するカテゴリからQ&Aを探す

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

Q質問する（無料）

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

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

おすすめ情報