點擊鏈接後刷新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內容

回答

相關問題