Question

在我的页面上有这样的按钮（用于显示购物车中的当前总数）：

function updateShoppingCart(newTotal) {
    var $div = $("#shoppingCart");

    var $a = $("<a class='waves-effect waves-teal btn-flat no-margin white-text right'></a>");
    var $i = $("<i class='material-icons right'>shopping_cart</i>");
    var $string = formatDecimal(newTotal,',','.') + " руб";

    $a.append($i);
    $a.append($string);

    $div.children().remove();
    $div.append($a);
}

用于更新该按钮总数的书面函数：

struct Asset: AssetProtocol {

    init (id: Int = 0, url: String) {
        self.id = id
        self.url = URL(string: url)
    }

    var id: Int 
    var url: URL?

}

但它不起作用。请帮助查找错误或我做错了什么。

Answer 1

设置$div = $('#shoppingCart');效率更高;在全局范围内并使用该var代替。这样，每次调用函数时，JS都不会搜索整个DOM。

你的东西不起作用，因为你的var很奇怪。我相信你想要实现的目标是：

<强> HTML

<a class="waves-effect waves-teal btn-flat no-margin white-text right" th:inline="text">
  <i class="material-icons right">shopping_cart</i>
  <span>[[@{${total}+' руб'}]]</span>
</a>

<强> JS：

function updateShoppingCart(newTotal) {
    var $div = $("#shoppingCart");

    var $a = $("a", $div); //select the <a> within the shoppingcart div
    var $i = $("i", $div); //select the <i> within the shoppingcart div
    var $span = $("span", $div); //select the newly added span
    var newPrice = formatDecimal(newTotal,',','.') + " руб";

    $span.text(newPrice);
}

我保留$a和$i作为示例，但我不认为您需要使用它们或完全替换它们，因为您只想更改文本。通过使用跨度，您可以在不替换所有html的情况下定价。

在旁注中，$通常用于声明var是一个jquery对象。 string在这种情况下不是jquery对象，因此$有点奇怪。

在旁注中，如果你想在一个元素中替换html，你应该尝试这样做：

function updateShoppingCart(newTotal) {
    var $div = $("#shoppingCart");

    var newPrice = formatDecimal(newTotal,',','.') + " руб";
    //Create the new HTML as a string, not as an element
    var newHtml= '<a href="#" class="somethingClass"><i>Shopping_cart</i>'+newPrice+'</a>';

    //empties div beforehand current html, no seperate removal needed.
    //Then places the html string within the element
    $div .html(newHtml); 
}

See working JSFiddle here

使用JavaScript更新按钮上的文本

1 个答案: