我想动态更改SVG元素的圆圈的颜色。如何根据AJAX通话响应中的值动态更改圆圈的颜色?

HTML:

<tr>
  <td style="width: 33.3333%; text-align: center;">
    <svg height="100" width="100">
      <circle id="parking_slot" cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="green" />
    </svg>
  </td>
</tr>


JavaScript:

$(document).ready(function() {
  $.ajax({
    url: 'url',
    type: 'GET',
    data: {
      format: 'json'
    },
    success: function(response) {
      if (response.field1 < 50) {
        $("#field1").text("car is parked");
        $("#parking_slot").fill("red");
      } else {
        $("#field1").text("car is not parked");
        $("#parking_slot").fill("green");
      }
    },
    error: function() {
      $('#errors').text("There was an error processing your request. Please try again.");
    }
  });
});

最佳答案

像这样使用:

$("#parking_slot").css("background-color", "red");

10-05 20:40
查看更多