Question

我有一个购物车，我可以从中删除产品，还有一个包含所有产品的购物车。我可以使用ajax单独删除产品，但

我想如果你在两个地方中的一个地方点击删除，它们将被删除，并在两个地方重新加载内容。现在只重新加载了一个地方，当我刷新页面时，我只能看到其他地方的变化。

如何做到这一点？

目前我的代码：

// Verwijder een product uit de winkelmand
tpj('.topnav--cart').on('click', '.remove', function(event) {
  // Stop de anchor tag van zijn normale gedrag
  event.preventDefault();
  // Haal het id op (de productnaam in dit geval)
  var $remove = tpj(this).attr('id');
  url = 'includes/shoppingcart.php';
  // Post bovenstaande waardes naar de action van de form
  var posting = tpj.post( url, { remove: $remove} );
  // Stop het resultaat in een div met het id #result
  posting.done(function( data ) {
    var content = tpj( data );
    tpj( "#result" ).empty().append( content );
  });
});


// Verwijder een product uit het winkelmandoverzicht
tpj('.cartpage').on('click', '.remove', function(event) {
  // Stop de anchor tag van zijn normale gedrag
  event.preventDefault();
  // Haal het id op (de productnaam in dit geval)
  var $remove = tpj(this).attr('id');
  url = 'includes/cartoverzicht.php';
  // Post bovenstaande waardes naar de action van de form
  var posting = tpj.post( url, { remove: $remove} );
  // Stop het resultaat in een div met het id #result
  posting.done(function( data ) {
    var content = tpj( data );
    tpj( "#cartresult" ).empty().append( content );
  });
});

所以目前有两个ajax脚本和两个php脚本，当我点击两个触发器中的一个时，是否有可能会被触发？

Answer 1

你不应该这样做，因为如果一个请求失败，另一个请求可能会执行。但如果你真的想一次执行两个请求，你应该this。

var one = function(ajax_request)

var two = function(ajax_request)

$.when(one, two).then(function(){
        $('.result').text(data)
    })

Answer 2

首先，您可以创建两个函数，这两个函数都可以在任一元素上单击执行：

var post1 = function($remove) {
    url = 'includes/shoppingcart.php';
    var posting = tpj.post( url, { remove: $remove} );
    posting.done(function( data ) {
      var content = tpj( data );
      tpj( "#result" ).empty().append( content );
    });
}

var post2 = function($remove) {
  url = 'includes/cartoverzicht.php';
  var posting = tpj.post( url, { remove: $remove} );
  posting.done(function( data ) {
    var content = tpj( data );
    tpj( "#cartresult" ).empty().append( content );
  });
} 

tpj('.topnav--cart').on('click', '.remove', function(event) {
  event.preventDefault();
  var $remove = tpj(this).attr('id');
  post1($remove);
  post2($remove);
}

tpj('.cartpage').on('click', '.remove', function(event) {
  event.preventDefault();
  var $remove = tpj(this).attr('id');
  post1($remove);
  post2($remove);
}

但最好的想法可能是创建一个特殊的路线，一次执行你的2个动作并在你的2个按钮上调用这个脚本：

var removeItem = function($remove) {
  url = 'includes/removeItem.php';
  var posting = tpj.post( url, { remove: $remove} );
  posting.done(function( data ) {
    var content = tpj( data );
    tpj( "#result" ).empty().append( content );
    tpj( "#cartresult" ).empty().append( content );
  });
}

tpj('.topnav--cart').on('click', '.remove', function(event) {
    event.preventDefault();
    var $remove = tpj(this).attr('id');
    removeItem($remove);
}

tpj('.cartpage').on('click', '.remove', function(event) {
    event.preventDefault();
    var $remove = tpj(this).attr('id');
    removeItem($remove);
}

只需单击一下即可执行两个ajax帖子，并在两个不同的位置显示内容

2 个答案: