0

我正在使用 simplecart.js，它为我生成数据以添加到购物车，然后为我将其传递给 PayPal。

我已经成功地添加了“添加到购物篮”和“结帐”功能，但是我发现不可能对 JS 生成的代码进行样式设置，因为没有任何样式应用于它。

这是网站给我的代码，它从存储的数据中生成许多项目，如名称、数量等。它正确输出所有信息，但应用于类名的任何样式都不起作用。

这是生成数据的代码：

<div class="simpleCart_items"></div>

这是来自网络浏览器的结果：

<div class="simpleCart_items"><div>
<div class="headerRow">
<div class="item-name">Name</div>
<div class="item-price">Price</div>
<div class="item-quantity">Qty</div>

<div class="item-remove"></div>
</div>
<div class="itemRow row-0 odd" id="cartItem_SCI-3">
<div class="item-name">The &nbsp;Jenny&nbsp;Snood&nbsp;£11</div>
<div class="item-price">£11.00</div>
<div class="item-quantity">1</div>
<div class="item-remove">
  <a href="javascript:;" class="simpleCart_remove">Remove</a>
</div>
</div>
</div>
</div>

浏览器正确接收所有数据，但对类名应用任何样式都无济于事。例如，我有：

.headerRow{
background-colour:#0F0;
}

结果应该是背景headerRow是石灰，但没有任何反应。它没有正确调用样式。

我已经尝试了所有方法，但没有一个类会获取应用于它们的样式。

这是它的外观截图，显然不是很好的无样式，但我根本无法对其应用任何样式。

购物车无样式

这是现场直播的链接

进一步的例子：

我添加了生成总数的代码：

<div class="simpleCart_total"></div>

我已经尝试给它自己的新类，并使用 !important 对原始类进行样式化 - 这些都不起作用。

<div class="totals simpleCart_total"></div>
.simpleCart_total{
  background-color:#0F0 !important;
}
.totals{
  background-color:#0F0 !important;
}

以上似乎都没有任何影响。

4

2 回答 2

0

还有一些其他 css 或内联 javascript 会影响您尝试使用的自定义样式。

要缓解此问题，请执行以下操作之一：

  • 在每个 css 语句之后添加 !important，如下所示：

    .headerRow{背景颜色：#0F0 !important;}

  • 重新排序 css 文件，使您的自定义 css 文件位于底部

于 2012-10-20T02:23:49.010 回答
0

这里的问题是样式是由 js 在 CSS 之后动态应用的（即在插件初始化期间）。我想，你唯一的希望是在初始化之后用你自己的 js 来设置它的样式。

您可以在 Firebug 中检查...如果您查看那里的元素，您应该会看到一堆内联样式应用于它们。这些将胜过您在标题中的 CSS（甚至是您事先提供的内联 CSS）。

编辑：我在相关指令之前看到了一些垃圾字符（以及另一个答案中指出的那些）。我会尝试在前面的指令之后和损坏的指令之前删除所有空白。js似乎没有动态改变任何东西。

于 2012-10-20T02:19:46.547 回答