将image从css调用为javascript并添加整数值

calling image from css to javascript and adding integer value

本文关键字：添加 整数 javascript image css 调用      更新时间：2024-05-13

我有一个css上的背景图像（从文件上传），我需要把它放在我的javascript文件中，并给它添加一个整数值，也许还可以把它放进数组中（如果有用，可以选择）。我想添加一个整数，因为每次我点击这个特定的图像，它都会被添加到"分数"部分（已经设置）。

有可能的方法吗？

以下是代码片段：css

div#gamearea4x4 div.row1#ga4r11{
    background-image: url(../graphics/8.png);
    width: 50px;
    height: 50px;
    background-size: 50px 50px;
    margin: 2px;
    border-radius: 5px;

以及javascript的各种尝试：

var img1 = document.getElementById("#ga4r11").style.backgroundImage;
img.value = "8";

或

var logo = $("#ga4r11").css('background-image').value = "8";

是否将整数添加到放置图像的div中？这可能就是你想要的：

var int = 8;
$("#ga4r11").css('background-image', '/'+int+'.png').attr('value', int);

通过这种方式，您可以动态设置整数。每次你有人点击图片/div:

$('#ga4r11').on('click', function(){
    int++;
    $("#ga4r11").attr('value', int);
});

如果你想让它更动态，你也可以动态地设置div id：

var int = 8;
var image_id = "image_" + int; 
$("#"+image_id).css('background-image', '/'+int+'.png').attr('value', int)

你必须对所有的图像id进行分类（比如

<div class="images" id="image_x">

)然后，如果你点击类，请致电：

 $('.images').on('click', function(){
    int++;
    $(this).attr('value', int);
});

这将为正确的id设置正确的值。

相关文章：