Как изменить фрагмент в src img с помощью jquery?

Question

я 2 DIV, я пытаюсь изменить ЦКЗ в классе сНу большой по щелчку на превью, я просто нужно изменить мир «большой» на «предварительный просмотр», не нашел хороший способ

<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">` , 

это только один изменение мира в ЦСИ

Thx за любую помощь привет

Answer 1

Простой, используйте функцию замены в JavaScript:

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 

Answer 2

Вы можете использовать заменяющие:

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); 
}); 

Answer 3

Попробуйте это:

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

Working Demo