我有一个模态对话框,显示用户何时将产品添加到购物车..我想在我的模态对话框中单击“更新购物车”按钮时自动显示此“迷你购物车”对话框,我不确定怎么做。
我正在使用Woocommerce,当点击更新购物车按钮然后页面刷新(但没有自动显示模态对话框),我想知道如何在点击更新购物车并重新加载文档后执行此操作。
我已阅读使用cookie并检查值,如果设置然后显示模态,我还想到了在购物车形式中添加隐藏输入的可能性,最后尝试在网址末尾追加一个字符串页面重新加载。这些都不是我的成功,我只是不知道如何在点击该按钮并重新加载页面后执行JS ..
这就是我的模态对话框......
$('#shopModal').foundation('reveal', 'open');
这里是整个javascript **我的问题是页面重新加载后dom重置,所以这实际上从未触发过。你会看到我的方法在这里实现..
<script type="text/javascript">
jQuery(document).ready(function($) {
if(window.location.href.indexOf("?added-to-cart=") > 0) {
$('#shopModal').foundation('reveal', 'open');
}
//after update cart has been clicked
$('#update-cart').click(function() {
//SetCookie('CartUpdated','yes',1);
//ShowReveal();
var $el = $('a[href*="/"]');
$el.attr("href", $el.attr("href")+ "?added-to-cart=");
});
var updated_cart = $.cookie('CartUpdated');
if(updated_cart == 'yes' {
$('#shopModal').foundation('reveal', 'open');
}
function ShowReveal() {
$('#shopModal').foundation('reveal', 'open');
}
function SetCookie(cookieName,cookieValue,nDays) {
var today = new Date();
var expire = new Date();
if (nDays==null || nDays==0) nDays=1;
expire.setTime(today.getTime() + 3600000*24*nDays);
document.cookie = cookieName+"="+escape(cookieValue)+ ";expires="+expire.toGMTString();
}
function ReadCookie(cookieName) {
var theCookie=" "+document.cookie;
var ind=theCookie.indexOf(" "+cookieName+"=");
if (ind==-1) ind=theCookie.indexOf(";"+cookieName+"=");
if (ind==-1 || cookieName=="") return "";
var ind1=theCookie.indexOf(";",ind+1);
if (ind1==-1) ind1=theCookie.length;
return unescape(theCookie.substring(ind+cookieName.length+2,ind1));
}
});
});
</script>
这是缩短的表格
<form action="<?php echo esc_url( $woocommerce->cart->get_cart_url() ); ?>" method="post">
<input id="update-cart" type="submit" class="button" name="update_cart" value="<?php _e( 'Update Cart', 'woocommerce' ); ?>" />
</form>
尝试在页面重新加载后将一个字符串(如add-to-cart =)应用到网址会更好吗,最好设置一个cookie并检查其值然后执行或者是否有我可以做的事情一个隐藏的输入字段?我尝试了所有这些,但无法找出它为什么不起作用?