Javascript 动态DIV不会从AJAX成功刷新
我有一个javascript函数,它为JSON调用服务器,并以HTML显示返回的数据。然后我通过AJAX删除了一个数据项,然后在success中尝试刷新DIV,但这不起作用。我也知道其他人也遇到过同样的问题,但我使用的代码是其他人用来解决的,但没有用。有人能帮忙吗,因为这看起来很琐碎,但我就是不能让它工作,非常感谢提前为这个错误的建议 JAVASCRIPT-Javascript 动态DIV不会从AJAX成功刷新,javascript,html,ajax,Javascript,Html,Ajax,我有一个javascript函数,它为JSON调用服务器,并以HTML显示返回的数据。然后我通过AJAX删除了一个数据项,然后在success中尝试刷新DIV,但这不起作用。我也知道其他人也遇到过同样的问题,但我使用的代码是其他人用来解决的,但没有用。有人能帮忙吗,因为这看起来很琐碎,但我就是不能让它工作,非常感谢提前为这个错误的建议 JAVASCRIPT- function getCartData(data){ // console.log(data); //console.log(JSON.
function getCartData(data){
// console.log(data);
//console.log(JSON.stringify(data.token));
//loop through JSON returned items array
for (var i = 0; i < data.items.length; i++) {
var id = data.items[i].id;
var title = data.items[i].title;
var price = data.items[i].price;
var quantity = data.items[i].quantity;
var image = data.items[i].image;
var error = 'error_'+ data.items[i].id;
var remove = 'remove_'+ data.items[i].id;
//bind JSON object to HTML
$("#result").append("<div class='column left'><img src="+ image + "width=100 height=100 style=padding:20px></div><div class='column middle' >" + " " + title + " " + price + "</div><div class='column right' ><input id='" + id + "' type=number min=1 max=10 step=1 value=" + quantity + " maxlength=2 size=2 /> <br><a id='" + remove + "' class='remove' >Remove</a><div id='" + error + "' class='error'></div></div>");
//load subtotal when page loads
$('#subtotal').html(data.items_subtotal_price);
}}
//invoke server >> bind to DOM
var script = document.createElement('script');
script.src = 'https://example.com/cart.json?callback=getCartData'
document.getElementsByTagName('head')[0].appendChild(script);
您可以在success中调用cart builder函数:
success: function(data) {
console.log(data); //formatted JSON data
alert('Item removed');
getCartData(data);
}
最终找到了一个有效的解决方案,我添加了另一个围绕数据行的div-
var row = 'row_'+ data.items[i].id; //declare variable then assign to new div row
<div id='" + row + "'>Content HTML...</div>
再次感谢所有的回复 您似乎只是重新加载购物车容器,但如果您没有更新它,那么它将是相同的?嗨,Andrea,我尝试过这个,但它不起作用,删除的项目仍然在页面上,直到我刷新整个页面,然后它消失。我现在注意到,您应该清空
$(“#结果”)
elementI尝试过,但它删除了所有HTML,整个页面需要刷新才能再次显示数据。我下面的解决方案是冗长的,但它奏效了。
success: function(data) {
console.log(data); //formatted JSON data
alert('Item removed');
getCartData(data);
}
var row = 'row_'+ data.items[i].id; //declare variable then assign to new div row
<div id='" + row + "'>Content HTML...</div>
$('#row_'+ remove_id).remove(); //remove the row