javascript - 无法更改 jquery 对象 css

Question

我正在尝试使用 Backbone 和 jQuery 更改两个元素子元素的 css。我的代码不工作。我认为问题在于 DOM 元素和 jQuery 对象之间存在差异。

这是我的代码:

App.Views.ExploreCard.user = App.Views.ExploreCard.Parent.extend({
  name: 'user',
  allowUntyped: true,
  classes: 'explore-person-box shadowed',
  onclick: function() {
    window.location.assign(this.data.profilePath);
  },
  postRender: function() {
    App.HCS.redrawHCS(this.$el);
  }
});

和

App.HCS = {
  redrawHCS: function(elements) {
    elements.each(function(index, value) {
      console.log(value);
      var hcs = $(value).find('.score');
      var border = $(value).find('.user-card-avatar-round');
      var score = $(hcs).html();
      console.log(hcs);
      console.log(border);
      console.log(score);
      if ( score <= 33 && score >= 1 ) {
        $(hcs).css("background-image", "image-url('heart_primary.png')");
        $(border).css("border", "3px solid #ff4013;");
      }
      else if ( score <= 66 && score >= 34 ) {
        $(hcs).css("background-image", "image-url('body_primary.png')");
        $(border).css("border", "3px solid #008cb4;");
      }
       else if ( score <= 99 && score >= 67 ) {
        $(hcs).css("background-image", "image-url('minf_primary.png')");
        $(border).css("border", "3px solid #fb9f00;");
      }
    });
  }
};

我不想做任何非常困难的事情。只需更改一些 css 规则即可。

我错过了什么？

Answer 1

你在 css 值的末尾有一个 ;

$(border).css("border", "3px solid #fb9f00");

对于图像，您还需要使用 url() 而不是 image-url()

$(hcs).css("background-image", "url('minf_primary.png')");

演示:Problem , Solution