ファイルの終了前にテキストを追加および削除する正規表現

Question

イメージのsrcを変更したい。マウスオーバーで

var string = "/images/myimage.png"; 

は、私が（ "/images/myimage_hover.png"）をMYIMAGEする を_hoverを追加したいとマウスアウトで、私は "_hover" を削除します。

誰かがこれに対して良いRegexpを持っていますか？

おかげ

Answer 1

一つのアイデア：

$('#imageid').hover(function() { 
    $(this).attr('src', function(i, val) { 
     return val.replace(/^(.+)(\..+)$/, '$1_hover$2'); 
    }); 
}, 
function() { 
    $(this).attr('src', function(i, val) { 
     // assuming image names don't contain other `_hover` text 
     return val.replace('_hover', ''); 
    }); 
}); 

更新：また、いくつかは、より洗練され、他の回答の表情をチェックしてください。）しかし、コールバックでattrを使用することは良い方法です。

Answer 2

編集おっとを - それは<img>タグの "SRC" ではなく、 "HREF"

さてあなたとURL自体を取得することができます：あなたがしたら

var imgUrl = $('#imageId').attr('src'); 

それを持って、と "_hover"を追加することができます：

imgUrl = imgUrl.replace(/^(.*)\.png$/, "$1_hover.png"); 

0私がしようとすると「foo_hover_hover.png」を防ぐために、最初の関数でテストを含め

$('#imageId').hover(
    function() { 
    var $img = $(this); 
    if (!/_hover\.png$/.test($img.attr('src'))) 
     $img.attr('src', $img.attr('src').replace(/^(.*)\.png$/, '$1_hover.png'); 
    }, 
    function() { 
    var $img = $(this); 
    $img.attr('src', $img.attr('src').replace(/_hover\.png$/, '.png'); 
    } 
); 

：適切なホバリングのために何かを設定するためにこのよう

imgUrl = imgUrl.replace(/_hover\.png/, '.png'); 

：

とはとにそれを削除します起こってから。

Answer 3

はここに関係なく、ファイルの拡張子が何であるか働かないソリューションです：

yourString = yourString.replace(/^(.+)\.([^.]+)$/, '$1_hover.$2'); // do this onmouseover 
yourString = yourString.replace(/^(.+)_hover\.([^.]+)$/, '$1.$2'); // do this onmouseout 

はデモ：

var testString = '"/images/myimage.png'; 
var regExp = /(.*)(\.)(.*)/g; 
var testHover = testString.replace(regExp, "$1_hover$2$3") 
alert(testHover); //Hover Image 
alert(testString.replace("_hover", ""));//Regular Image 

Answer 4

はこれを試してみてくださいファイル名は？あなたのフォーマットが一貫している場合や、エクステンションを別々に保存する場合、あなたの人生を楽にすることができます。そうすることで、命名規則が変更された場合、正規表現の改ざんの可能性は低くなります。ちょうどニック「ニャー」の

i.e. 
var str = "/images/myimage" + (is_selected ? "_hover" : "") + ".png" 

Answer 5

は拡張子を格納しない考えがあります：

js> var yourString = 'meow.test.png'; 
js> yourString = yourString.replace(/\.([^.]+)$/, '_hover.$1'); 
meow.test_hover.png 
js> yourString = yourString.replace(/_hover\.([^.]+)$/, '.$1'); 
meow.test.png 
js>