divの背景イメージURLを取得できず、jqueryで置き換えられません。

Question

ライトボックスを作成しています。ライトボックストリガークラスをクリックすると、より大きなサイズが表示されます。

これは私がやっていることです： lightboxtriggerクラスの画像をクリックすると、すべての無効な文字を含まない配列にURLを格納してから、ライトボックスモードのsrcを配列に置き換えます。

私はこのことがうまくいかないようですが、なぜ私が使っている小さなスクリプトが文字列を正しく置き換えないのでしょうか？

<script> 
 

 
$('.triggerlightbox').click(function(){ 
 
var e=$(this); 
 
var bg = e.css("background-image"); 
 
bg = bg.replace(/.*\s?url\([\'\"]?/, '').replace(/[\'\"]?\).*/, ''); 
 
$('.photogallery__viewer__image').html('<img src="' + bg + '" />'); 
 
}); 
 

 
</script>

.photogallery__maincontainer{ width:1300px; height:580px; ; flex:0 0 auto; display:flex; flex-flow:row; flex-wrap:wrap; justify-content:flex-start;} 
 

 
.photogallery__viewer{ width:55%; height:100%; position:relative; display:flex; } 
 

 
.photogallery__viewer__image{max-width:80%; height:auto; margin:auto; overflow:hidden; box-shadow:0 0 25px #111;} 
 

 
.photogallery{ 
 
\t 
 
\t width:42%; 
 
\t height:93%; 
 
\t position:relative; 
 
\t display:flex; 
 
\t flex-wrap:wrap; 
 
\t justify-content:flex-start; 
 
\t align-content:flex-start; 
 
\t overflow:auto; 
 
\t 
 
} 
 

 

 
.photogallery__image{ 
 
\t background-image: url('images/20170819_194526.jpg'); 
 
\t background-position: center; 
 
\t background-repeat: no-repeat; 
 
\t background-size:contain; 
 
\t max-height:20%; 
 
\t min-height:20%; 
 
\t flex:0 0 calc(25% - 15px); 
 
\t margin-right:15px; 
 
\t margin-bottom:35px; 
 
\t cursor:pointer; 
 
} 
 

 
.photogallery__image:hover{ 
 
\t opacity:0.8; 
 
} 
 

 
.close{width:3%; cursor:pointer; color:rgba(255, 255, 255, 0.7); font-family: 'Nunito', sans-serif; flex:0 0 3%; text-align:center; display:table; font-size:25px; font-weight:600; } 
 

 
.close:hover{color:rgba(255, 255, 255, 0.5);}

<div class="photogallery__maincontainer" style=""> 
 
    <span style="display:none; cursor:pointer; color:rgba(255, 255, 255, 0.5); font-family: 'Nunito', sans-serif; font-size:50px; font-weight:600; position:absolute; bottom:5px; right:320px;">&#129087;</span> 
 
    
 
    <div class="photogallery__viewer" style=""> 
 
\t <img class="photogallery__viewer__image" src="images/IMG-20170610-WA0025.jpg" style=""> 
 
\t </div> 
 
\t <div class="photogallery" style=""> 
 
\t <div id="last" class="photogallery__image" style="background-image: url('images/');"></div> 
 
    </div> 
 
    <span class="close" style="">X</span> 
 
    
 
    </div>

Answer 1

何かが正規表現と可能性が間違っている：

は、ここに私のコードです。

これは、代わりに動作するはずです：

bg = bg.split("'")[1];