div変更画像をクリックすると

-1

divの背景画像をクリックしてdivを押し続けてから 'rust.jpg'に戻るときに 'rustb.png'に変更したいdivを離れる（クリックしたままにする）。これは私が持っているもので、divをクリックすると何もしません。div変更画像をクリックすると

<html> 

<head> 
<title> Img Change Testing </title> 
</head> 

<style> 
#noclick { 
    background-image: url("rust.jpg"); 
    width: 33%; 
    height: 50%; 
    left: 50%; 
    right: 50%; 
    background-size: 100% 100%; 
} 
#pushclick { 
    background-image: url("rustb.png"); 
    width: 33%; 
    height: 50%; 
    left: 50%; 
    right: 50%; 
    background-size: 100% 100%; 
} 
</style> 
<body> 

<div id="noclick" onclick="mouseState(e)"> 

    <p>This is an image</p> 

</div> 

</body> 

<script> 
$("img.noclick") 
.mousedown(function() { 
$(this).prop("id", 'pushclick'); 
}) 
.mouseup(function() { 
$(this).prop("id", 'noclick'); 
}); 
</script> 
</html>

助けてください、ありがとう！

出典

2016-12-06 Nate Rice

？ – j08691

@ j08691 "失語症は定義されていません"？ –

これは唯一のエラーですか？もしそうなら、なぜあなたは 'onclick =" mouseState（e） "'を持っていますか？ – j08691

あなたのコードはいくつかの問題、

あなたは間違っているクラスセレクタを使用してdiv要素にアクセスしている任意の画像タグ
を持っていけないを持っています。あなたは、ブラウザのコンソールで入手できますかどのようなエラー
あなたは（準備中で結合あなたのjQueryのイベントをラップする必要があります）

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 

 
<head> 
 
    <title>Img Change Testing</title> 
 
</head> 
 

 
<style> 
 
    #noclick { 
 
    background-image: url("rust.jpg"); 
 
    width: 33%; 
 
    height: 50%; 
 
    left: 50%; 
 
    right: 50%; 
 
    color: red; 
 
    background-size: 100% 100%; 
 
    } 
 
    #pushclick { 
 
    background-image: url("rustb.png"); 
 
    width: 33%; 
 
    height: 50%; 
 
    left: 50%; 
 
    right: 50%; 
 
    color: green; 
 
    background-size: 100% 100%; 
 
    } 
 
</style> 
 

 
<body> 
 

 
    <div id="noclick"> 
 

 
    <p>This is an image</p> 
 

 
    </div> 
 

 
</body> 
 

 
<script> 
 
    $(document).ready(function() { 
 
    $("div#noclick").mousedown(function() { 
 
     $(this).attr("id", 'pushclick'); 
 
     }) 
 
     .mouseup(function() { 
 
     $(this).attr("id", 'noclick'); 
 
     }); 
 

 
    }); 
 
</script> 
 

 
</html>

出典

2016-12-06 14:48:10 ScanQR

<div id="noclick" onclick="mouseState(e)"> 
    <p>This is an image</p> 
    </div> 

$("#noclick").on("mousedown", function() { 
    $(this).attr("id", 'pushclick'); 
    }); 
$("body").on("mouseup","#pushclick",function() { 
    $(this).attr("id", 'noclick'); 
    });

fiddle link here

出典

2016-12-06 15:05:58

div変更画像をクリックすると

答えて

関連する問題