如何在 ionic 中使用 JS 显示跨度

how to display a span with JS in ionic

本文关键字：JS 显示 ionic      更新时间：2023-09-26

我已经尝试了很多，只是为了在离子中显示一个简单的变量，但它不起作用？ 谁能告诉我出了什么问题？

我已经在代码片段中显示了两种方式...而对于我的生活，我都无法弄清楚我做错了什么？

localforage.setItem('milk', '0.0', callbackFunction);
var coffee = localStorage.getItem("coffee") ?  localStorage.getItem("coffee") : 0.0;
function milkIt(){
  milk = milk += 1;
}
function coffeeIt(){
  coffee = coffee += 1;
  document.getElementById("coffee").innerHTML = coffee;
}
var coffee = localStorage.getItem("coffee") ?  localStorage.getItem("coffee") : 0.0;
var totalCoffee = localStorage.getItem("totalCoffee") ? localStorage.getItem("totalCoffee") : 0.0;
var coffeePs = localStorage.getItem("coffeePs") ? localStorage.getItem("coffeePs") : 0;
var cookRate = localStorage.getItem("cookRate") ?  localStorage.getItem("cookRate") : 1.0;
$("#coffeeButton").click(function(e) {
    var obj = $("#clone").clone();
    var img = $("#myImg").clone(); 
    $("body").append(obj);
    $("body").append(img);
    obj.html("+"+ cookRate);
    coffee += cookRate;
    totalCoffee += cookRate;
    document.getElementById("coffee").innerHTML = prettify(coffee);
    document.getElementById("totalCoffee").innerHTML = prettify(totalCoffee);
    obj.css('position','absolute'); 
    obj.css('z-index', '2');
    img.css('position','absolute');
    img.show();
    obj.offset({left: e.pageX-10, top: e.pageY-80});
    img.offset({left: e.pageX-10, top: e.pageY-50});
    obj.animate({"top": "-=80px"}, 1000, "linear", function() {
        $(this).remove();
    }); 
    img.animate({"top": "-=80px"}, 1000, "linear", function() {
        $(this).remove();
    });
});
.button{
	display: block;
}
#coffeeButton{
	cursor: pointer; cursor: hand; background: #5EFF8F; border-radius: 7px; margin: 5px; padding: 20px; font: bold 30px Tahoma; text-align: left;
	-webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -user-select: none;
}
#clone{
	font-size: 1.5em;
	font-weight: bold;
	color: white;
	-webkit-touch-callout: none;
	-webkit-user-select: none; 
	-moz-user-select: none; 
	-ms-user-select: none; 
	-user-select: none;
}
<div class = "col">
  Milk = <span id = "milk">0.0</span>
</div>
<div class = "col">
  Coffee = <span id = "coffee">0.0</span>
</div>
<div class = "row">
  <div class = "col"><button on-tap="milkIt()" class="button button-balanced button-block button-large">Milk Cow</button></div>
  <div class = "col"><button on-tap="coffeeIt()" class="button button-assertive button-block button-large">Sell Milk</button></div> 
         
</div>
<div id = "coffeeButton">Make Coffee <br /><span id = "cookRate">1</span> Per Click</div>Coffee = <span id = "coffee">0.0</span>

从顶部开始：

localforage.setItem('milk', '0.0', callbackFunction);

回调函数未在任何地方定义。

milk = milk += 1;
"牛奶+=1;"与"牛奶=牛奶+1;"

相同，所以你的行意味着"牛奶=牛奶=牛奶+1;"

var coffee = localStorage.getItem("coffee") ?  localStorage.getItem("coffee") : 0.0;

此行重复。 您只能定义一次变量。 这应该是完全咖啡吗？

止步于此。 祝你好运。

相关文章：