Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как заменить буквы в слове правильнее (https://javascript.ru/forum/jquery/17886-kak-zamenit-bukvy-v-slove-pravilnee.html)

shaltay 07.06.2011 14:38

Как заменить буквы в слове правильнее
 
Доброго времени. По нажатии на картинку, она должна поменяться. Точнее, должен смениться ее src.

Как это правильнее сделать в jquery?
В js есть replace(), а в jquery я его не нашел. Только replaceWith или replaceAll. Что можете посоветовать?

Нужно: images/img1.png поменять на images/imgh2.png

shaltay 07.06.2011 14:50

Пробовал
$(this).attr('src').replace(/img/, 'imgh');
$(this).attr('src').replace('img', 'imgh');


Ничего не работает..

Kolyaj 07.06.2011 14:56

this.src = 'images/imgh2.png';

shaltay 07.06.2011 14:59

Цитата:

Сообщение от Kolyaj (Сообщение 107632)
this.src = 'images/imgh2.png';

Это конечно понятно. Но у меня 40 картинок и src у всех разные. Надо заменить именно одну часть только.

shaltay 07.06.2011 15:05

Все, разобрался сам, спасибо. Надо было в переменную загнать значение.

shaltay 07.06.2011 15:13

Ну вот теперь более сложная задача. При нажатии на картинку, она должна меняться. Но при нажатии на другую картинку, предыдущая должна стать оригинальной. Стандартный эффект переключения кнопок.
Можно сделать через siblings(), но боюсь, что комп будет считать очень долго. Нет никаких решений с "предыдущей" картинкой или как-то еще?

walik 07.06.2011 16:50

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
$(function() {
   $('img').click(function() {
      var precedent = $('img.current');
      precedent.attr('src', precedent.attr('original'));
      precedent.removeClass('current');
      $(this).addClass('current').attr('original', $(this).attr('src')).attr('src', 'http://javascript.ru/forum/images/smilies/laugh.gif');
   });
});
</script>
<style>
img {
   cursor: pointer;margin-right: 20px;
}
</style>
</head>
<body>
<img src="http://javascript.ru/forum/images/smilies/smile.gif" />
<img src="http://javascript.ru/forum/images/smilies/unsure.gif" />
<img src="http://javascript.ru/forum/images/smilies/tongue.gif" />
<img src="http://javascript.ru/forum/images/smilies/agree.gif" />
<img src="http://javascript.ru/forum/images/smilies/dance3.gif" />
</body>
</html>

shaltay 07.06.2011 17:06

Walik, спасибо! Но опять не то. Нужно каждой картинке делать при нажатии уникальную вторую картинку. Т.е. общее колво картинок all*2

Сделал так. Картинки были pay_doX.png и pay_dolX.png
$(paySystemId+' img').click( function() {
   $(paySystemId+' img').each(function () {
      var hoverImg = $(this).attr('src').replace(/pay_dol/g, 'pay_do');
      $(this).attr('src',hoverImg);
   });
   var hoverImgThis = $(this).attr('src').replace(/pay_do/g, 'pay_dol');
   $(this).attr('src',hoverImgThis);
});


Везде кроме оперы более менее сносно работает. В опере подтормаживает. Там 40 картинок. Но как сделать проще - не придумал.

walik 07.06.2011 17:42

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
$(function() {
   $('img').click(function() {
      var precedent = $('img.current');
      precedent.attr('src', precedent.attr('original'));
      precedent.removeClass('current');
      $(this).addClass('current').attr('original', $(this).attr('src')).attr('src', $(this).attr('hover'));
   });
});
</script>
<style>
img {
   cursor: pointer;margin-right: 20px;
}
</style>
</head>
<body>
<img src="http://javascript.ru/forum/images/smilies/smile.gif" hover="http://javascript.ru/forum/images/smilies/sad.gif" />
<img src="http://javascript.ru/forum/images/smilies/unsure.gif" hover="http://javascript.ru/forum/images/smilies/thank_you2.gif" />
<img src="http://javascript.ru/forum/images/smilies/tongue.gif" hover="http://javascript.ru/forum/images/smilies/wink.gif" />
<img src="http://javascript.ru/forum/images/smilies/agree.gif" hover="http://javascript.ru/forum/images/smilies/yes4.gif" />
<img src="http://javascript.ru/forum/images/smilies/dance3.gif" hover="http://javascript.ru/forum/images/smilies/mad.gif" />
</body>
</html>

shaltay 07.06.2011 18:36

Спасибо Большое!
Скажите, что значит var precedent = $('img.current'); ?


Часовой пояс GMT +3, время: 12:57.