Question

我是jQuery的新手，我在展示不同的背景图片时感到沮丧点击事件。有什么简单的方法吗？

Answer 1

您可以在某种链接/图像/按钮上使用click()，然后使用css()切换图像路径。

$("#button").click(function() {
    $('#image').css("background-image", "url(/myimage.jpg)");
});

Answer 2

1.7+

$("#id").on("click", function () {
    $(this).css("background-image", "url(/url/to/background/image.jpg)");
});

＆LT; 1.7

$("#id").bind("click", function () {
    $(this).css("background-image", "url(/url/to/background/image.jpg)");
});

Answer 3

它就像这个一样简单

$("#mylink").click(function() { 
           // ^ Attach a function on click event of an element with id="mylink"
  //Change the css of a element with id="myDiv"
  $("#myDiv").css("backgroundImage", "url(newimage.jpg)");
               // Note ^: In jQuery, the parameters with "-" as define that way
               // But of course .css() supports "-" also, but make a habit of doing in camel-case
});

Demo

Answer 4

$("#your_element").click(function () {
    $("#your_element").css("background-image", "url(" + image_url + ")");
}

将#your_element替换为适当的选择器，将image_url替换为有效的网址，并且您是金色的。

Answer 5

$("#divBg").css("background-image", "url(http://www.androidgamespro.com/static/pic7/micky_tap_tap-jazz_jackrabbit-1_010-icon0.png)");

以下是示例：http://jsfiddle.net/aGAha/2/

Answer 6

阅读你的问题并且知道你是jQuery的新手，我想更详细地解释答案。

每个人都以各种可能的方式给出了正确答案。

首先访问页面上您需要使用jQuery选择器选择元素的任何元素

所有jQuery方法都可以在document.ready函数

中访问

$(document).ready(function() {
//this represents window.load in javascript.

//now to select the element suppose you have anchor tag <a> with id=clickme

$("#clickme").click(function() {

//select the element whose background image you want to change. suppose with id=imgBack
$("#imgBack").css({'background-image':'url(newimage.jpg)'}); 

// Note image can be of any format (.png, .jpg, .gif, etc).
// this way you can change the image. 
})
});

有关选择具有班级名称的元素的更多详细信息，请参阅jQuery网站。

Answer 7

$("#mylink").click(function() { 
  $('body').css({'background-image':'url(new_image.jpg)'}); 
});
<div id="mylink">Click me</a>

Answer 8

我遇到了同样的问题并找到了使用此解决方案的解决方案 - https://github.com/rewish/jquery-bgswitcher#readme

使用jQuery“点击”更改背景图像

8 个答案:

Demo