0

私は 2 つの div を持っています。プレビューのクリックで div クラスの src を大きく変更しようとしています。「プレビュー」で世界を「大きく」変更する必要があるだけですが、良い方法が見つかりませんでした

<div class="big"> <img src="image_big_123"> </div>
<div class="preview"> <img src="image_preview_642.jpg"> </div>

$('.preview').click(function(){ 
$('.big').attr('src', '?');
});

Result exepcted for this exemple , when you click on the div class preview , src image in div class big change for `<img src="image_preview_123">` ,

そのため、src のワールド変更は 1 つだけです

ヘルプに関してはThx

4

3 に答える 3

1

簡単です。javascript で replace 関数を使用します。

var preview2big = $('#preview img').attr('src').replace("_preview_", "_big_");
// in your code:
$('.big img').attr('src', $('#preview img').attr('src').replace("_preview_", "_big_") );

ソースがどこから必要なのか、何を置き換えるのかがよくわかりません=、原則は同じままです。

ネイティブ JS にもう少し (私はこちらの方が好みで、読みやすくもあります):

$('.big img')[0].src = $('#preview img')[0].src.replace("_preview_", "_big_");

またはトグルのようなもの (必要な場合):

var newSrc = $('#preview img')[0].src;
var newSrc = newSrc.test(/_preview_/) ? newSrc.replace('_preview_', '_big_') : newSrc.replace('_big_', '_preview_');

$('.big img')[0].src = newSrc ; // this is preview if it was big ans vica versa
于 2013-11-13T13:40:46.893 に答える
0

置換を使用できます：

 var source = $('.big').find('img').attr('src'); //Get the current source
 var newsource = source.replace('big', 'preview'); // Replace the word 'big' with preview' 

 $(".big").find('img').attr('src', newsource); //Set the new source

したがって、最終的なコードは次のようになります。

<div class="big"> <img src="image_big_123"> </div>
<div class="preview"> <img src="image_preview_642.jpg"> </div>

$('.preview').click(function(){ 
   var source = $('.big').find('img').attr('src');
   var newsource = source.replace('big', 'preview');
   $(".big").find('img').attr('src', newsource);
});
于 2013-11-13T13:40:04.593 に答える
-2

これを試して：

$('.preview').click(function() {
   var prev = $('.big').children('img').attr('src').substring(10); 
   var newsrc = 'image_preview_'+prev;
  $('.big').children('img').attr('src', newsrc)
});

ワーキングデモ

于 2013-11-13T13:52:14.923 に答える