Skip to content

Instantly share code, notes, and snippets.

@Kaiyuan
Last active April 27, 2016 21:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Kaiyuan/440cde9f62d4b8babd93660d48ead41a to your computer and use it in GitHub Desktop.
Save Kaiyuan/440cde9f62d4b8babd93660d48ead41a to your computer and use it in GitHub Desktop.
使用 JS 提交 Post 的 PayPal 捐赠按钮。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Donate</title>
</head>
<body>
<input id="ppButton" class="ppButton" type="submit" border="0" name="button" alt="PayPal" value="Donate">
</body>
</html>
.ppButton {
background: #ebeef0 url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IlBheVBhbCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSI1MTJweCIgaGVpZ2h0PSIxNDVweCIgdmlld0JveD0iMCAwIDUxMiAxNDUiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiAxNDUiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iIzBDMzI1OSIgZD0iTTQ5LjU0Nyw3Mi45MzFjLTMuNjUsMC03LjMwMS0wLjAxNi0xMC45NTEsMC4wMDdjLTEuNzg4LDAuMDExLTMuMDk3LDAuNzQtMy42MjUsMi41ODINCgljLTEuMjAxLDQuMTg2LTYuMjk4LDIyLjkyNi03LjYzMywyOC4xMTNjLTAuNjk0LDIuNjk4LTIuMDksMy44MTktNC44NjIsMy44MzVjLTUuNzQzLDAuMDMzLTExLjQ4NywwLjA0My0xNy4yMzEsMC4wNDUNCgljLTMuMDczLDAuMDAxLTQuMzczLTEuMzY2LTMuOTE2LTQuNDQxYzAuMzg5LTIuNjIsMTUuNDQ3LTY3LjE3LDIyLjM0My05Ni44NjFDMjQuNTc3LDIuMzE4LDI2LjIyNywwLjk5MSwzMC4yNDUsMQ0KCWMxMC42ODMsMC4wMjQsNDMuNDQ0LDAuMTgxLDQ5LjE0MiwwLjIxYzE0LjI5NSwwLjA3MywyNi4xMiwxMS41MTMsMjYuNjAzLDI1Ljc2OGMwLjMyNiw5LjYyMS0xLjUzNCwxOC43MDItNi45MjgsMjYuODMzDQoJQzkzLjc5Niw2MS43NDksODYuMjIyLDY2LjU5LDc3LjM0MSw2OS41NEM2OC4zMjIsNzIuNTM2LDU4Ljk5Niw3My4zOTcsNDkuNTQ3LDcyLjkzMXogTTUwLjIyMyw1My4wMTQNCgljMi41NTItMC4xODgsNC42ODktMC4yNjEsNi44MDQtMC41MTdjNS4zMzEtMC42NDQsMTAuNDQ1LTEuOTgyLDE0Ljc5OS01LjMyM2M1LjAwNC0zLjg0MSw2Ljc0Mi04Ljk1OCw1LjY5Ny0xNS4xMDYNCgljLTAuOTQ3LTUuNTctNC42MDQtOC42MjUtOS42NjUtMTAuMjk2Yy01LjIzMS0xLjcyOC0xMC42MzktMS43ODctMTYuMDUxLTEuMzQ2Yy0yLjcyNSwwLjIyMi00LjUwMSwxLjc0OS01LjE2Nyw0LjUxMg0KCWMtMC42MzMsMi42MjMtMS40NzIsNS4xOTgtMi4wNzEsNy44MjhjLTEuMTA0LDQuODQ4LTIuMTcxLDkuNzA2LTMuMTEsMTQuNTg4Yy0wLjYsMy4xMTksMC40ODMsNC42NjgsMy41MjIsNS4xOTENCglDNDYuODM4LDUyLjg2NCw0OC43NDYsNTIuODksNTAuMjIzLDUzLjAxNHoiLz4NCjxwYXRoIGZpbGw9IiMwQzMyNTkiIGQ9Ik0yMDMuMDI2LDE0My41OTdjMy4wODQsMCw2LjE3MS0wLjA3Niw5LjI1MSwwLjAyN2MxLjk4MywwLjA2NiwzLjUyOS0wLjU0LDQuNjUxLTIuMTc2DQoJYzEuOTA1LTIuNzc4LDYzLjM2Mi0xMDIuOTQzLDY4LjUzNC0xMTEuNzM1YzEuMzA3LTIuMjIyLDAuNTQ3LTMuOTY4LTEuODk1LTQuMDAyYy02LjczMy0wLjA5NS0xMy40NjktMC4wMTUtMjAuMjAzLDAuMDc4DQoJYy0xLjc0MiwwLjAyNC0zLjAyNiwwLjg3NC00LjAxNSwyLjQ3NWMtNC43ODcsNy43NTEtMjQuMzM2LDM5LjE3Ny0yOS4yNzQsNDcuMTY5Yy0wLjI5MSwwLjQ3LTEuMDcsMS4wMi0xLjQ5NywwLjkzMQ0KCWMtMC41NjEtMC4xMTctMS4wNS0wLjc4OC0xLjQ2NC0xLjMwNmMtMC4yMTUtMC4yNjktMC4yMjEtMC43MTYtMC4yODctMS4wODljLTAuNjgtMy44MjktNS4zMjEtMzIuMDkzLTcuMDM1LTQyLjM4NQ0KCWMtMC43MjctNC4zNjktMi44OTUtNi4xNDctNy4zMTQtNi4xMTJjLTQuNjA0LDAuMDM3LTkuMjA2LDAuMTc3LTEzLjgxLDAuMjY4Yy0zLjU2LDAuMDcxLTUuNTk3LDIuNDE2LTUuMDk1LDUuOTI5DQoJYzAuMjc1LDEuOTI0LDEyLjM4NSw2Ni43NDksMTQuNDc3LDc3LjQ0OGMwLjA5LDAuNDU4LDAuMTk3LDAuOTksMC4wNTMsMS40MDJjLTAuNDgsMS4zNzEtMC44OTEsMi44MTUtMS42NDgsNC4wMzMNCgljLTQuNjgsNy41MzgtOS40NTEsMTUuMDIxLTE0LjE3OSwyMi41MjljLTAuNDI4LDAuNjc5LTAuOTM1LDEuMzc0LTEuMTE3LDIuMTMxYy0wLjYxMSwyLjU0Mi0wLjc4Nyw0LjIyOSwyLjg5Myw0LjE1Mg0KCUMxOTcuMDQzLDE0My4zMDIsMjAzLjAyNiwxNDMuNTE1LDIwMy4wMjYsMTQzLjU5N3oiLz4NCjxwYXRoIGZpbGw9IiMwQzMyNTkiIGQ9Ik0xNDkuODI5LDk5LjE3Yy0xLjU5NywwLjg2OC0yLjc2MywxLjQ4OS0zLjkxNywyLjEzMWMtMi44NTksMS41OS01Ljc0NiwzLjEzNC04LjU2Myw0Ljc5Nw0KCWMtNS4zNjMsMy4xNjYtMTEuMjY2LDMuODU1LTE3LjI5NCwzLjY3NmMtMy4wNTctMC4wOTEtNi4xNzgtMC40MTItOS4xMjktMS4xNzZjLTcuNzIzLTEuOTk5LTEyLjMxNC03LjAxMi0xMy4yMzEtMTUuMDU1DQoJYy0wLjc1Ny02LjY0MS0wLjA4NC0xMy4wOTYsMy4yODEtMTkuMDI2YzMuNzgzLTYuNjY3LDkuODc3LTEwLjI4MiwxNi45MzEtMTIuNjExYzYuMzQ0LTIuMDk0LDEyLjg5Ny0yLjU2MSwxOS41MDgtMi42OTkNCgljNS4yMTgtMC4xMDgsMTAuNDM1LTAuMjg0LDE1LjY1Mi0wLjQzOGMwLjYxNS0wLjAxOCwxLjIzLTAuMTU4LDEuODQxLTAuMTMzYzIuNTA2LDAuMTAxLDMuNjA2LTEuNDY3LDQuMDEzLTMuNTc4DQoJYzAuMzM3LTEuNzQ2LDAuNjE5LTMuNTgzLDAuNDQ1LTUuMzMyYy0wLjM1MS0zLjUyOS0yLjI1My01LjY1LTUuNzY2LTYuMDMyYy00LjI3MS0wLjQ2NC04LjYwMy0wLjcwNy0xMi44OTQtMC41Nw0KCWMtNi4yNTksMC4yLTEyLjQ3MywxLjA0OC0xOC41MjQsMi43NzdjLTAuOTQ5LDAuMjcxLTEuODQ1LDAuNzI4LTIuNzYxLDEuMTExYy0yLjQxMywxLjAwOS00LjYwMy0wLjE2NS00LjQxLTIuNzE0DQoJYzAuMzExLTQuMDk3LDAuODI4LTguMjEsMS42OTQtMTIuMjIyYzAuNDc1LTIuMjA1LDIuMzU4LTMuNTc4LDQuNzEtNC4wNWM3LjgzMi0xLjU3MSwxNS43MzYtMi40NDMsMjMuNzIyLTIuNjUyDQoJYzYuNDctMC4xNjksMTIuODk3LDAuMDUsMTkuMjQyLDEuNDc4YzUuNzg0LDEuMzAyLDEwLjYyMSw0LjI1MiwxNC42OTksOC40NzdjNC40MjMsNC41ODIsNS45MTMsMTAuMjAxLDQuNzg2LDE2LjMNCgljLTIuMDkyLDExLjMyMy05LjM1Myw0NS41MzktMTAuNjgsNTEuMzYxYy0wLjY1LDIuODU0LTIuMzI4LDQuMzU2LTUuMjc5LDQuNDU5Yy01LjQ5OSwwLjE5Mi0xMS4wMDUsMC4yMzUtMTYuNTA4LDAuMjgxDQoJYy0xLjYzNiwwLjAxNC0yLjA2OS0wLjU1My0xLjk3NC0yLjIyNUMxNDkuNTM2LDEwMy41MzgsMTQ5LjY3NCwxMDEuNTcxLDE0OS44MjksOTkuMTd6IE0xNDcuNzM1LDcwLjEzOA0KCWMtMC4wMDEsMC4wMzgtMC4wMDEsMC4wNzYtMC4wMDIsMC4xMTRjLTIuNDYsMC4xNTQtNC45MjQsMC4yNi03LjM3OSwwLjQ3MmMtNC4wNzksMC4zNTEtOC4wODcsMS4wNjktMTEuODA5LDIuODc0DQoJYy00Ljk0NSwyLjM5OS02LjkzMyw1LjgzOC02LjYxNiwxMS4yOThjMC4yODYsNC45MjcsMy4yNjYsOC4wNjEsOC4xNjIsOC42NjdjMy45NTcsMC40OSw3Ljg2NiwwLjEsMTEuNzMzLTAuNjY3DQoJYzMuMDg2LTAuNjEyLDUuODY1LTEuOTU2LDcuODk2LTQuNDU5YzMuODAyLTQuNjg0LDQuOTc2LTEwLjIyOSw1LjAxMi0xNi4wODZjMC4wMDktMS4zODctMC44NzUtMi4xMzUtMi4zMDgtMi4xOTgNCglDMTUwLjg2NCw3MC4wODUsMTQ5LjI5OCw3MC4xMzgsMTQ3LjczNSw3MC4xMzh6Ii8+DQo8cGF0aCBmaWxsPSIjMjg1RDhCIiBkPSJNMzI1Ljg1LDcyLjkzMWMtMy42NSwwLTcuMzAxLTAuMDE2LTEwLjk1MSwwLjAwN2MtMS43ODgsMC4wMTEtMy4wOTcsMC43NC0zLjYyNSwyLjU4Mg0KCWMtMS4yMDEsNC4xODYtNi4yOTgsMjIuOTI2LTcuNjMzLDI4LjExM2MtMC42OTQsMi42OTgtMi4wOSwzLjgxOS00Ljg2MiwzLjgzNWMtNS43NDMsMC4wMzMtMTEuNDg3LDAuMDQzLTE3LjIzMSwwLjA0NQ0KCWMtMy4wNzMsMC4wMDEtNC4zNzMtMS4zNjYtMy45MTYtNC40NDFjMC4zODktMi42MiwxNS40NDctNjcuMTcsMjIuMzQzLTk2Ljg2MWMwLjkwNS0zLjg5NCwyLjU1NC01LjIyMSw2LjU3My01LjIxMg0KCWMxMC42ODMsMC4wMjQsNDMuNDQ0LDAuMTgxLDQ5LjE0MiwwLjIxYzE0LjI5NSwwLjA3MywyNi4xMiwxMS41MTMsMjYuNjAzLDI1Ljc2OGMwLjMyNiw5LjYyMS0xLjUzNCwxOC43MDItNi45MjgsMjYuODMzDQoJYy01LjI2Niw3LjkzOC0xMi44NDEsMTIuNzc5LTIxLjcyMSwxNS43MjlDMzQ0LjYyNSw3Mi41MzYsMzM1LjMsNzMuMzk3LDMyNS44NSw3Mi45MzF6IE0zMjYuNTI2LDUzLjAxNA0KCWMyLjU1Mi0wLjE4OCw0LjY4OS0wLjI2MSw2LjgwNC0wLjUxN2M1LjMzMS0wLjY0NCwxMC40NDUtMS45ODIsMTQuNzk5LTUuMzIzYzUuMDA0LTMuODQxLDYuNzQyLTguOTU4LDUuNjk3LTE1LjEwNg0KCWMtMC45NDctNS41Ny00LjYwNC04LjYyNS05LjY2NS0xMC4yOTZjLTUuMjMtMS43MjgtMTAuNjM5LTEuNzg3LTE2LjA1MS0xLjM0NmMtMi43MjUsMC4yMjItNC41MDEsMS43NDktNS4xNjcsNC41MTINCgljLTAuNjMzLDIuNjIzLTEuNDcyLDUuMTk4LTIuMDcxLDcuODI4Yy0xLjEwNCw0Ljg0OC0yLjE3MSw5LjcwNi0zLjExLDE0LjU4OGMtMC42LDMuMTE5LDAuNDgzLDQuNjY4LDMuNTIyLDUuMTkxDQoJQzMyMy4xNDEsNTIuODY0LDMyNS4wNSw1Mi44OSwzMjYuNTI2LDUzLjAxNHoiLz4NCjxwYXRoIGZpbGw9IiMyODVEOEIiIGQ9Ik00MjUuNTQxLDk5LjIwNWMtMS4wMDYsMC40MTYtMS42MjUsMC42MTgtMi4xOTQsMC45MTdjLTQuNTMyLDIuMzgyLTkuMDYxLDQuNzcyLTEzLjU3OSw3LjE4DQoJYy00LjM5LDIuMzQtOS4xOTYsMi41NTEtMTMuOTgsMi41NjRjLTQuMDMxLDAuMDExLTguMDMtMC41MDQtMTEuODE2LTIuMTE2Yy02LjU4OS0yLjgwNS05Ljk1My03Ljg1My0xMC42NTItMTQuODgxDQoJYy0wLjQ5MS00LjkzNi0wLjA4Ni05Ljc3MywxLjU4NC0xNC40MzZjMi44NDUtNy45NDUsOC43NzMtMTIuNzIyLDE2LjQ0LTE1LjY1NWM2Ljg4LTIuNjMyLDE0LjA0NS0zLjM2NiwyMS4zNDMtMy40NTINCgljNS42NDQtMC4wNjcsMTEuMjg3LTAuMzE0LDE2LjkyOS0wLjUxMmMzLjQ1My0wLjEyMSw0LjM0NS0wLjc0Myw1LjExNi00LjA4OWMwLjM4Ny0xLjY4MSwwLjUyOC0zLjQ5MiwwLjM3NS01LjIwNw0KCWMtMC4yODQtMy4xOC0yLjMzNC01LjQyNS01LjY1NS01Ljg3MWMtMy42OTItMC40OTYtNy40NTItMC44MDEtMTEuMTcxLTAuNzEzYy02Ljk3MSwwLjE2NS0xMy44ODYsMS4wMTUtMjAuNjI3LDIuOTI4DQoJYy0wLjgxMiwwLjIzLTEuNTgyLDAuNjIxLTIuMzU0LDAuOTc2Yy0yLjYxMiwxLjIwMS00Ljc1My0wLjAxNy00LjUzMi0yLjg0YzAuMjk4LTMuODEyLDAuNzY2LTcuNjMsMS40NzgtMTEuMzg1DQoJYzAuNDI4LTIuMjU4LDIuMDM0LTMuOTM0LDQuNC00LjM0MmM0LjgtMC44MjgsOS42MDktMS43NjIsMTQuNDU1LTIuMTM4YzYuMTM4LTAuNDc2LDEyLjMyNC0wLjcyOSwxOC40NzQtMC41NTQNCgljNy45NTgsMC4yMjcsMTUuNjM1LDEuNzQ1LDIyLjA3Miw3LjAyN2MzLjg5MywzLjE5NSw2Ljg5LDYuOTMyLDcuNzYxLDEyLjAzM2MwLjYxNiwzLjYwNywwLjE5OCw3LjE5Ny0wLjU0NSwxMC43MzUNCgljLTMuMjU5LDE1LjUxMy02LjU1OSwzMS4wMTgtOS44NTcsNDYuNTIzYy0wLjg4Miw0LjE0Ni0yLjI2Niw1LjM5NS02LjQ0Nyw1LjUzYy01LjA3NCwwLjE2NS0xMC4xNTIsMC4yMDItMTUuMjI5LDAuMjUzDQoJYy0xLjgyNiwwLjAxOS0yLjE4MS0wLjM2Ny0yLjExOS0yLjE3N0M0MjUuMjc5LDEwMy41Myw0MjUuNDE1LDEwMS41NTgsNDI1LjU0MSw5OS4yMDV6IE00MjUuODQ3LDcwLjA1Mg0KCWMtMy4yMiwwLjE5OS02LjczNSwwLjI5NC0xMC4yMjEsMC42NjNjLTMuOTYzLDAuNDItNy44NywxLjIwMS0xMS40NDUsMy4xMDljLTMuMjc2LDEuNzQ5LTUuNTk4LDQuMjcxLTYuMDM0LDguMDg5DQoJYy0wLjYwOCw1LjMzMSwxLjIyNSwxMC45NDksOC4zNTcsMTEuNzM2YzQuMjUzLDAuNDY5LDguNDIxLDAuMDcsMTIuNTQtMC45MmMzLjgzMy0wLjkyMiw2Ljc1NC0zLjE2Miw4LjcxMi02LjU4OA0KCWMyLjI4NS0zLjk5OCwzLjE4NS04LjM5MywzLjQxOC0xMi45MjZjMC4xMTgtMi4yOTEtMC44NjItMy4xMzgtMy4xOTItMy4xNjFDNDI3LjM2NSw3MC4wNDcsNDI2Ljc0OCw3MC4wNTIsNDI1Ljg0Nyw3MC4wNTJ6Ii8+DQo8cGF0aCBmaWxsPSIjMjg1RDhCIiBkPSJNNDg0LjM4MiwxMDcuMzg1YzIuMjk5LTAuMDU3LDIuODEtMC41LDMuMjg5LTIuNTM1YzIuMDYxLTguNzQ4LDE3LjU0OS03NC4xMTYsMjMuMjA4LTk4LjA1Nw0KCWMwLjYyLTIuNjIxLTEuMjE3LTQuOTEyLTMuOTUxLTQuOTMzYy01LjQxMS0wLjA0Mi0xMC44MjEtMC4wNjUtMTYuMjMyLTAuMDY4Yy0zLjI4Mi0wLjAwMi00Ljg3NiwxLjIzNC01LjY0OSw0LjQzDQoJYy0xLjE2OCw0LjgyOC0yMC43NDMsOTMuODU5LTIxLjMyNCw5OC4wMjRjLTAuMjgxLDIuMDE2LDAuODQyLDIuOTQ0LDIuODY5LDIuOTNDNDY5LjQ4NywxMDcuMTU0LDQ4Mi44NjQsMTA3LjQyMyw0ODQuMzgyLDEwNy4zODV6Ig0KCS8+DQo8L3N2Zz4NCg==) no-repeat center center;
background-size: 60%;
transition: all .3s;
display: inline-block;
margin: 0 auto;
padding: 0;
width: 80px;
height: 28px;
line-height: 15em;
overflow: hidden;
border-width: 0;
border-radius: 20px;
cursor: pointer;
outline: none;
-webkit-font-smoothing: antialiased;
-webkit-appearance: none;
-webkit-user-select: none;
white-space: pre;
border: none;
align-items: flex-start;
text-align: center;
}
.ppButton:hover {
background-color: #dce2e6;
}
/* 使用立即购买按钮的代码修改 */
var ppitem_name = "easy-select-style"; //项目名称
var donatrNo = ''; //金额
/* 账户建议使用 Unicode */
var ppbusiness = "\u0073\u0065\u0061\u006c\u006f\u0075\u0072\u0040\u0067\u006d\u0061\u0069\u006c\u002e\u0063\u006f\u006d"; //账户
//创建 Paypal 表单
function ppPost() {
// 提交到的地址
var tempForm = document.createElement("form");
tempForm.id = "paypal";
tempForm.method = "post";
tempForm.action = "https://www.paypal.com/cgi-bin/webscr";
tempForm.target = "paypal";
// 告诉 PayPal 这是捐赠按钮
var cmd = document.createElement("input");
cmd.type = "hidden";
cmd.name = "cmd"
cmd.value = "_donations";
tempForm.appendChild(cmd);
// 受捐赠的账户
var business = document.createElement("input");
business.type = "hidden";
business.name = "business"
business.value = ppbusiness;
tempForm.appendChild(business);
// 地区语言
var lc = document.createElement("input");
lc.type = "hidden";
lc.name = "lc"
lc.value = "US";
tempForm.appendChild(lc);
// 项目名称
var item_name = document.createElement("input");
item_name.type = "hidden";
item_name.name = "item_name"
item_name.value = ppitem_name;
tempForm.appendChild(item_name);
var no_note = document.createElement("input");
no_note.type = "hidden";
no_note.name = "no_note"
no_note.value = "0";
tempForm.appendChild(no_note);
// 货币种类
var currency_code = document.createElement("input");
currency_code.type = "hidden";
currency_code.name = "currency_code"
currency_code.value = "USD";
tempForm.appendChild(currency_code);
var bn = document.createElement("input");
bn.type = "hidden";
bn.name = "bn"
bn.value = "PP-DonationsBF:btn_donate_SM.gif:NonHostedGuest";
tempForm.appendChild(bn);
// 提交表单
document.body.appendChild(tempForm);
tempForm.submit();
document.body.removeChild(tempForm);
}
// 按钮触发提交
$('body').on('click', '#ppButton', function() {
ppPost();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment