Paypal按钮预加载器

Paypal button preloader

本文关键字：加载 按钮 Paypal      更新时间：2023-09-26

在大多数ie浏览器上，paypal按钮加载时间大约需要2-5秒。我想知道是否有一种方法可以在按钮不出现时放置预加载器。

我已经知道JS和如何添加预加载器，对我来说困难的是如何捕捉在DOM中显示的按钮事件?

编辑:按钮通过PHP回显。下面是代码:

$str = '<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">'.PHP_EOL;
$str .='<input type="hidden" name="custom" value="'.$_SESSION["user_id"].'">'.PHP_EOL;
$str .='<input type="hidden" name="notify_url" value="myCensoredUrl">'.PHP_EOL;
$str .='<input type="hidden" name="cmd" value="_s-xclick">'.PHP_EOL;
$str .='<input type="hidden" name="hosted_button_id" value="myPayPalCensoredButtonID">'.PHP_EOL;
$str .='<input type="image" src="https://www.paypalobjects.com/he_IL/IL/i/btn/btn_paynowCC_LG.gif" border="0" name="submit" alt="PayPal - הדרך הקלה והבטוחה לשלם באינטרנט!">'.PHP_EOL;
$str .='<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">'.PHP_EOL;
$str .='</form>'.PHP_EOL;
return $str;

编辑2:alt标签不会改变任何东西，如果你的网络很慢，paypal按钮将不会显示，直到与他们的服务器通信完成。

alt标签确实是专门为这种事情设计的但如果你真的想捕捉图像加载事件你可以这样做:

function preload() {
  var image = new Image();
  image.src = "https://www.paypalobjects.com/he_IL/IL/i/btn/btn_paynowCC_LG.gif";
  image.onload = function() {
      var btn = document.getElementById("pay-button");
      btn.setAttribute('src', image.src);
      btn.setAttribute('type', 'image');
  };
}
document.addEventListener("DOMContentLoaded", preload);
<form>
    <input id="pay-button" type="submit" name="submit" value="Click here to pay now"/>
</form>

它将显示一个常规按钮，并在加载时将其替换为图像

相关文章：