Question

我在mySQL数据库中有一些产品，其链接是在我的脚本中用$ producturl检索的。这些网址实际上是将产品添加到购物车（http://www.example.com/cart/?add-to-cart=1127）。我正在尝试创建一个脚本，允许用户将产品添加到购物车但不重定向，只需执行链接，以便用户保持在同一页面上。

我正在使用preventDefault和stopPropgation但它无法正常工作。警报显示但当我稍后查看我的购物车产品不存在时，链接本身没有执行。有什么帮助吗？

<?php $producturl = ProductURL::find(array('Product'=>$tube1->Tube1));
if($producturl[0]->URL!=NULL){  
echo '<span id="shop">Add Cart NoRedirect</span>';
}
?>

<script type="text/javascript">
$(document).on('click', '#shop', function (event) {
 $.post( '<?php echo $producturl[0]->URL; ?>' );
event.preventDefault();
event.stopPropagation();
alert('Product has been added to cart');
});
</script>

Answer 1

尝试：

'<a href="#" id="shop">Add Cart NoRedirect</a>'

或

'<a href="javascript: return false;" id="shop">Add Cart NoRedirect</a>'

Answer 2

您的HTML锚链接：

<a id='link1' href="http://www.google.com">Link</a>

需要jQuery JS（不要忘记把它放在DOM就绪函数中）：

// Act on clicks to a elements
$("#link1").on('click', function(e) {
    // prevent the default action, in this case the following of a link
    e.preventDefault();
    // capture the href attribute of the a element
    var url = $(this).attr('href');
    // perform a get request using ajax to the captured href value
    $.get(url, function() {
        // success
    });
});

这展示了实现您的功能所需的所有原则。

有问题的页面和发布到的URL必须位于同一个子域中，否则必须在服务器上正确启用跨源资源共享，否则请求将因跨域限制而失败。

Answer 3

您可以使用图像，按钮，div或装饰为链接的文本而不是链接。

Answer 4

'<a href="javascript: void(0);" id="shop">Add Cart NoRedirect</a>'

如何单击将执行但不重定向的链接。

4 个答案: