Tôi có thể lấy url hình nền của div không?

Tôi có một nút mà khi tôi nhấp vào nó, tôi muốn cảnh báo background-imageURL của #div1.

Nó có khả thi không?

Tôi thường thích .replace()biểu thức chính quy khi có thể, vì nó thường dễ đọc hơn: http://jsfiddle.net/mblase75/z2jKA/2

    $("div").click(function() {
        var bg = $(this).css('background-image');
        bg = bg.replace('url(','').replace(')','').replace(/\"/gi, "");
        alert(bg);
    });

Có, điều đó có thể xảy ra:

$("#id-of-button").click(function() {
    var bg_url = $('#div1').css('background-image');
    // ^ Either "none" or url("...urlhere..")
    bg_url = /^url\((['"]?)(.*)\1\)$/.exec(bg_url);
    bg_url = bg_url ? bg_url[2] : ""; // If matched, retrieve url, otherwise ""
    alert(bg_url);
});

Tôi có câu trả lời được cải thiện một chút, xử lý các định nghĩa CSS mở rộng như:

background-image: url(http://d36xtkk24g8jdx.cloudfront.net/bluebar/359de8f/images/shared/noise-1.png), -webkit-linear-gradient(top, rgb(81, 127, 164), rgb(48, 96, 136))

Mã JavaScript:

var bg = $("div").css("background-image")
bg = bg.replace(/.*\s?url\([\'\"]?/, '').replace(/[\'\"]?\).*/, '')

Kết quả:

"http://d36xtkk24g8jdx.cloudfront.net/bluebar/359de8f/images/shared/noise-1.png"

Như đã đề cập, giải pháp Blazemongers không xóa được dấu ngoặc kép (ví dụ như Firefox trả về). Vì tôi thấy giải pháp của Rob Ws khá phức tạp, nên thêm 2 xu của tôi vào đây:

$('#div1').click (function(){
  url = $(this).css('background-image').replace(/^url\(['"]?/,'').replace(/['"]?\)$/,'');
  alert(url);
})

Tôi nghĩ rằng việc sử dụng một biểu thức chính quy cho điều này bị lỗi chủ yếu do

• Sự đơn giản của nhiệm vụ
• Chạy một biểu thức chính quy luôn tốn nhiều cpu hơn / lâu hơn là cắt một chuỗi.

Vì các thành phần url (" và ") là không đổi, hãy cắt chuỗi của bạn như sau:

$("#id").click(function() {
     var bg = $(this).css('background-image').trim();
     var res = bg.substring(5, bg.length - 2);
     alert(res);
});

Tôi đang sử dụng cái này

  function getBackgroundImageUrl($element) {
    if (!($element instanceof jQuery)) {
      $element = $($element);
    }

    var imageUrl = $element.css('background-image');
    return imageUrl.replace(/(url\(|\)|'|")/gi, ''); // Strip everything but the url itself
  }

Đây là một regex đơn giản sẽ loại bỏ url("và ")khỏi chuỗi được trả về.

var css = $("#myElem").css("background-image");
var img = css.replace(/(?:^url\(["']?|["']?\)$)/g, "");

Chỉ sử dụng một lệnh gọi tới replace(phiên bản regex): var bgUrl = $('#element-id').css('background-image').replace(/url\(("|')(.+)("|')\)/gi, '$2');