In the google chrome browser, everything works, and firefox finds nothing, in the console either empty or null.

$("html,body").on("click", ".k_s_main", function(){ // получение фона var section_bg = $(this).parents(".k_section").css("background"); //var myRe = /url\(\"(.+?)\"\)/ig; //var s_bg = myRe.exec(section_bg); console.log(section_bg); }) 
 .k_section { width: 32px; height: 32px; background: url('https://www.gravatar.com/avatar/ed370216aefa86d4246055ccdc9394e5?s=32&d=identicon&r=PG'); } .k_s_main {width: 32px;height: 32px;} 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="k_section"> <div class="k_s_main"></div> </div>

If it is more specific, then you need to get exactly the path to the background image, and not the entire url ("... etc., but in the end everything works fine in chrome

    2 answers 2

    You need to use background-image, after which we delete the url and the path to the image remains:

     $("div").click(function() { var bg = $(this).css('background-image'); bg = bg.replace('url(','').replace(')','').replace(/\"/gi, ""); alert(bg); });
    • Thanks, the decision helped, but still the main question is why it does not work: $ (id) .css ("background"); after all in chrome works. - Vladimir
    • one
      @Vladimir, because the background is both image and color , i.e. it will give two values - Yuri
    • L. Vadim, and if he has single quotes or without them? - Yuri

    1) The image must be specified through background-image
    2) Get one link can be a regular expression

     $(document).on("click", ".k_s_main", function(){ // получение фона var section_bg = $(this).parents(".k_section").css("background-image").replace(/url\((?:\"|\')?(.+)(?:\"|\')?\)/, '$1'); //var myRe = /url\(\"(.+?)\"\)/ig; //var s_bg = myRe.exec(section_bg); console.log(section_bg); }) 
     .k_section { width: 32px; height: 32px; background-image: url('https://www.gravatar.com/avatar/ed370216aefa86d4246055ccdc9394e5?s=32&d=identicon&r=PG'); } .k_s_main {width: 32px;height: 32px;} 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="k_section"> <div class="k_s_main"></div> </div>

    Checked in firefox - everything works