点击链接后刷新div内容

Prestashop v1.6 default-bootstrap主题，product-list.tpl文件。点击链接后刷新div内容

我有一个按钮添加到购物车和DIV一些智者代码：

<a class="ajax_add_to_cart_button" href="...."> 

<div id="div1">{if $added}Added{else}not added{/if}</div>

现在，当我点击链接我只想刷新DIV的内容。

我已经尝试了一些代码在堆栈中查找，但我的知识还不够。

我尝试它不工作：

$(document).on('click', '.ajax_add_to_cart_button', function() { 
    $("#div1").load()  /*also $("#div1").load("#div1")*/ 
});

和：

$("#div1").load(location.href + " #div1");

和几个。

编辑，也这不是为我工作：

$(function(){ 
$(document).on('click', '.ajax_add_to_cart_button', function(e) { 
e.preventDefault(); 
$("#div1").load($(this).attr("href")); /*and this: $("#div1").load($(this).attr("href #div1"));*/ 
return false 
}); 
});

EDIT2：当我尝试这个代码是成功的一半工作

$(document).ready(function(){ 
$(".ajax_add_to_cart_button").click(function(){ 
$("#div1").html("result reloaded successfully"); 
}); 
});

为什么一半？因为文本是显示的，但仅限于第一个产品，并且不管我点击哪一个产品，并且我也尝试切换html()至load()或refresh()，但此时不起作用。

EDIT3

$(document).ready(function(){ 
var productid = "{product.id_product}" 
$(".ajax_add_to_cart_button").click(function(){ 
$("#div1" + productid).html("result reloaded successfully"); 
}); 
}); 


<div id="div1{product.id_product}">{if $added}Added{else}not added{/if}</div>

这是所有产品的展示信息，在产品的所有容器必须现在不同的ID。

来源

2017-01-20 Agnes Tom

嗨，我不明白好你想要做什么，因为你只对第一个产品对你说现在还不清楚，你可以给我解释一下更好？ – sarcom

我有一个产品列表，每个产品都有这个字段'＃div1'，当我添加第三个产品到购物车时，这个消息从'html（）'应该显示在第三个产品上，但它始终显示在第一个产品上。 –

嗯......我明白了......我想你的问题是你对所有的产品使用相同的编号。 DOM'应该'有一个元素的唯一ID，尝试另一种方式，也许一个简单的类作为选择器，你不能对所有元素使用相同的ID :) – sarcom

尝试以下，并检查它是否工作..

$(function(){ 
$(document).on('click', '.ajax_add_to_cart_button', function(e) { 
    e.preventDefault(); 
    $("#one").load($(this).attr("href")); 
    return false. 
}); 

});

我注意到你有错误的类在你的选择。请检查一下。

来源

2017-01-20 22:17:44

谢谢，但这不适合我，而且你有错误后的点，我也编辑我的第一篇文章与我尝试。在div中加入你的解决方案后，所有的网站内容和产品都没有去购物车。 –

嗯......我明白了......我想你的问题是你所有的产品都使用相同的ID。 DOM'应该'有一个元素的唯一ID，尝试另一种方式，也许一个简单的类作为选择器，不能对所有元素使用相同的ID :)

例如（我假设您的div有mybeautifuldiv类）：

$(document).ready(function(){ 
    $(".ajax_add_to_cart_button").click(function(){ 
     $(".mybeautifuldiv").html("result reloaded successfully"); 
    }); 
});

来源

2017-01-22 16:25:52 sarcom

如果你想做到这一点时，有（产品列表分类页面等），那么你需要的目标适当的股利。你可能不想在你的div中使用id而是class。

<div class="my-custom-div">{if $added}Added{else}not added{/if}</div>

此div是否添加到购物车锚？如果是，那么你需要针对它：

$(document).ready(function(){ 
    $(".ajax_add_to_cart_button").click(function() { 
     $(this).find('.my-custom-div').html('Content updated!'); 
    }); 
});

如果没有，那么你可以遍历产品的父DIV，发现里面您的自定义格。例如，在默认的prestashop主题的分类页面：

$(document).ready(function(){ 
    $(".ajax_add_to_cart_button").click(function() {   
     $(this).closest('.product-container').find('.my-custom-div').html('Content updated!'); 
    }); 
});

来源

2017-01-23 12:01:12 TheDrot

点击链接后刷新div内容

回答

相关问题