在选择它之前，我有一个图像，当我选择它时，应该将其更改为另一个图像

Question

我有一个广播按钮和一个图像，当我选择图像时，我应该用另一个图像

替换它

function getAirlinesById(idAirlines) {
            $.ajax({
                dataType: 'json',
                type: "POST",
                url: '{{route('get-baggage-airlines')}}',
                data:"airlines_id="+idAirlines,
                success: function(response){
                    console.log(response);
                    $("#baggageAirline").empty();
                    for(let i=0;i<response.length;i++){
                        let category = response[i].baggage.category;
                        switch(category) {
                            case 1:
                            category = "KG";
                            break;
                            case 2:
                            category = "PCS";
                            break;
                        };
                        $("#baggageAirline").append('<div class="col-3 list-baggage"><input type="radio" class="input-radio-costum" required onclick="getPrice('+response[i].price_in_SGD+')" onchange="changeBackground('+response[i].baggage.config_baggage_id+')" name="baggage" value="'+response[i].baggage.max_range+' '+category+'"><img src="{{asset("assets/image/baggage.png")}}" class="image-default" id="image-selected'+response[i].baggage.config_baggage_id+'"><p class="baggage-amount">'+response[i].baggage.max_range+' '+category+'</p><p class="text-center tcc">'+response[i].currency_symbol+' '+response[i].price_in_SGD+'</p></input></div>');
                    }
                },
                error: function(xhr, status, error) {
                    alert('ERR_CONNECTION_TIMED_OUT');
                    location.reload();
                }
            });
        }

我已经尝试过这样的尝试，但是我选择的图像仍然存在，并且所有这些图像都被选择了，只能选择一个图像，因为它使用了无线电按钮

function changeBackground(idBaggage){
        $('#image-selected'+idBaggage).css({
            'background-image' : "url('assets/image/baggageblack.png')",
            'margin-top' : '-30px',
        });
    }

Answer 1

如果要替换为背景图像，则创建两个类

.default-image {
  background-image: url('/path');
  .change-image {
    background-image: url('/path') !important;
   }
}

最初仅将.default-image类添加到元素中，当您选择图像时，进行OnClick事件并添加.change-image类。.change-image类属性将覆盖您的.default-image属性图像。