使用knockout设置背景图像:适用于Chrome但不适用于其他浏览器

Question

我正在使用knockout在一些div上设置背景图像:

<div class="values" data-bind="foreach: values" >
  <div class="cvsection" data-bind="style: {'background-image': backgroundimg}" style="background-repeat: no-repeat; background-size:100%;background-repeat: no-repeat; background-position: center bottom;">

    <!-- Stuff inside the div -->   
  </div>
</div>

在我的viewmodel中,每个value()都有一个属性,如:

backgroundimg: 'url(i/img.jpg)'

背景图片在Chrome和IE9中显示为预期,但不是Firefox 15或IE8.我在控制台或其他任何地方都没有看到任何javascript错误.

你认为这是淘汰赛或其他一些CSS问题吗？任何帮助,将不胜感激!

Answer 1

我想你的片段应该是

<div class="values" data-bind="foreach: values" >
  <div class="cvsection" data-bind="style: {backgroundImage: backgroundimg}" style="background-repeat: no-repeat; background-size:100%;background-repeat: no-repeat; background-position: center bottom;">

    <!-- Stuff inside the div -->   
  </div>
</div>

'background-image'已更改为backgroundImage

根据文件:

如果要应用字体粗细或文本修饰样式或其名称不是合法JavaScript标识符的任何其他样式(例如,因为它包含连字符),则必须使用该样式的JavaScript名称.