innerHTML not updating
innerHTML not updating
我正在尝试更新元素的innerHTML,但没有得到任何输出。
每次点击墨西哥卷饼的图片,墨西哥卷饼价格都应该加到总额中。这些值是数字,而不是字符串。
任何帮助都很感激,我被难住了。
(function() {
var T1 = document.querySelector('#taco1');
T1.addEventListener("click", function(e) {
if (e.target.tagName === "IMG") {
var Total = document.getElementById("Total").textContent;
var price = document.getElementById("p1").textContent;
var nbrprice = parseInt(price);
var nbrTotal = parseInt(Total);
console.log("value of nbrprice is " + nbrprice)
console.log("nbrprice is a " + typeof(nbrprice));
console.log("nbrTotal is a " + typeof(nbrTotal));
var sum = Number(price) + Number(Total);
console.log("sum is a " + typeof(sum));
console.log("value of sum is " + sum);;
}
var sumtxt = (sum + nbrprice);
Total.innerHTML = sumtxt.toString();
console.log(Total);
}, false);
})();
<div id='taco1'>
<img src="https://placehold.it/300x100" width="300" />
<p>Taco One Price: <span id="p1">4</span>
</p>
</div>
<div id='taco2'>
<img src="https://placehold.it/300x100" width="300" />
<p>Taco Two Price: <span id="p2">5</span>
</p>
</div>
<div>Total: $<span id="Total">0</span>
</div>
var Total = document.getElementById("Total");
//...
var nbrTotal = parseInt(Total.textContent);
//...
Total.innerHTML=sumtxt.toString();
应该工作
您的错误是使用,TOTAL交换机上的InnerHTML设置为如下
var Total = document.getElementById("Total").textContent;
而不是仅在中使用innerHTML
var Total = document.getElementById("Total");
请参阅此处:单击#taco1
时,会将值添加到总数中。请在此处尝试:
(function() {
var T1 = document.querySelector('#taco1');
T1.addEventListener("click", function(e) {
if (e.target.tagName === "IMG") {
var Total = document.getElementById("Total").textContent;
var price = document.getElementById("p1").textContent;
var nbrprice = parseInt(price);
var nbrTotal = parseInt(Total);
console.log("value of nbrprice is " + nbrprice)
console.log("nbrprice is a " + typeof(nbrprice));
console.log("nbrTotal is a " + typeof(nbrTotal));
var sum = Number(price) + Number(Total);
console.log("sum is a " + typeof(sum));
console.log("value of sum is " + sum);;
var sumtxt = (sum + nbrprice);
console.log("sumtxt is a " + typeof(sumtxt));
console.log("value of sumtxt is " + sumtxt);;
console.log("sumtxt is a " + typeof((sumtxt).toString()));
console.log("value of sumtxt is " + (sumtxt).toString());;
document.getElementById("Total").innerHTML = sumtxt;
console.log(sumtxt);
}
}, false);
})();
<div id='taco1'>
<img src="https://placehold.it/300x100" width="300" />
<p>Taco One Price: <span id="p1">4</span>
</p>
</div>
<div id='taco2'>
<img src="https://placehold.it/300x100" width="300" />
<p>Taco Two Price: <span id="p2">5</span>
</p>
</div>
<div>Total: $<span id="Total">0</span>
</div>
var Total = document.getElementById("Total").textContent;
// ...
Total.innerHTML = sumtxt.toString();
这是为什么预期的工作?
您需要设置元素的innerHTML
,以便更新该元素。
我在文本区域也遇到了同样的问题。对我有效的是改变";值";组件的属性
相关文章:
- jQuery is not loaded
- AngularJS JSON not arriving php
- $rootScope not working
- reactRedux is not defined
- jQuery document.ready not working
- Javascript/Jquery Blob not showing Chrome PDF
- ReferenceError: not defined
- ReferenceError: cordova is not defined @ng-cordova.min.js:7
- Javascript getElementsByTagName not working?
- jQuery's trim()的前缀为not运算符
- ngDialog not updating $scope
- fetch is not updating collection.model.models
- DOM not updating
- jQuery $(window).resize Chrome not updating
- AngularJS not updating?
- innerHTML not updating
- Jquery mobile Collabsible Listview not updating
- textContent not updating HTML
- Javascript Select Option not updating
- ngFor not updating in IE 11 (RC4 with CoreJS)