發送由<input type =「range」>（滑塊）計算的變量爲PayPal按鈕的價格值<input type =「hidden」name =「amount」>

我試圖用多個（滑塊）貝寶爲了製作一個動態按鈕，其價格值根據滑塊值而變化。發送由<input type =「range」>（滑塊）計算的變量爲PayPal按鈕的價格值<input type =「hidden」name =「amount」>

到目前爲止，我已經設法將計算出的值作爲javascript中的變量（var = mapoman）。但是我一直未能將價值傳遞給PayPal按鈕...我正在使用一個無託管的PayPal按鈕。

我假設計算值存儲在輸入中，對嗎？目前在窗體輸入計算通過輸出和功能顯示Add（）計算的值爲貝寶按鈕...

我不能使用PHP，因爲我的服務器目前無法處理它。所以我試圖實現這隻使用JavaScript。

以下是我的代碼.. 我真的很希望它是可行的！我感謝任何建議，謝謝！

<html> 

<head> 

<script language="javascript"> 

function Add(){ 
document.mapo.mapoprice.value = eval(document.mapo.slider1.value) + eval(document.mapo.slider2.value) + eval(document.mapo.slider3.value) + eval(document.mapo.slider4.value) + eval(document.mapo.slider5.value) + eval(document.mapo.slider6.value) + eval(document.mapo.slider7.value) + eval(document.mapo.slider8.value); 
} 

function GetMapoman(){ 
var mapoman = document.getElementById("mapoprice").value; 
document.getElementById("saru").innerHTML = mapoman; 
} 

</script> 

</head> 

<body> 

<form name="mapo" oninput="total.value = slider1.valueAsNumber + slider2.valueAsNumber + slider3.valueAsNumber + slider4.valueAsNumber + slider5.valueAsNumber + slider6.valueAsNumber + slider7.valueAsNumber + slider8.valueAsNumber;Add();GetMapoman();"> 

<input name="slider1" id="slider1" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider2" id="slider2" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider3" id="slider3" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider4" id="slider4" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider5" id="slider5" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider6" id="slider6" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider7" id="slider7" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input name="slider8" id="slider8" type="range" min="3" max="8" value="3" step="1" style="width:650px"> 

<input type="text" name="mapoprice" id="mapoprice"><!-- <--is this storing the value calculated by the sliders above???--> 
<output name="total" for="slider1 slider2 slider3 slider4 slider5 slider6 slider7 slider8"></output> 

</form> 

<p id="saru"></p> 

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top"> 
<input type="hidden" name="cmd" value="_xclick"> 
<input type="hidden" name="business" value="---.com"> 
<input type="hidden" name="lc" value="GB"> 
<input type="hidden" name="item_name" value="---"> 
<input type="hidden" name="amount id="totalmapo"><!--this bit I'm trying to put the calculated value by the sliders--> 
<input type="hidden" name="currency_code" value="GBP"> 
<input type="hidden" name="button_subtype" value="services"> 
<input type="hidden" name="no_note" value="0"> 
<input type="hidden" name="cn" value="Add special instructions to the seller:"> 
<input type="hidden" name="no_shipping" value="2"> 
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted"> 
<input type="image" src="http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal – The safer, easier way to pay online."> 
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1"> 
</form> 

</body> 

</html>

來源

2014-09-26 awishiki

你在這裏面臨什麼問題？ – Vimalnath 2014-09-26 09:23:44

嗨，問題是我無法將滑塊計算的值傳遞給paypal的價值（價格）。我一直在嘗試很多在stackoverflow中建議的方法，但還沒有設法找出它... – awishiki 2014-09-26 09:29:11

你可以檢查答案 – Vimalnath 2014-09-26 10:09:49

經過這麼多的試驗和錯誤，我終於設法實現了我想要的功能，而不需要jQuery。

<html> 

<head> 

<script type="text/javascript" > 

function Add(){ 
document.mapo.mapoprice.value = eval(document.mapo.slider1.value) + eval(document.mapo.slider2.value) + eval(document.mapo.slider3.value) + eval(document.mapo.slider4.value) + eval(document.mapo.slider5.value) + eval(document.mapo.slider6.value) + eval(document.mapo.slider7.value) + eval(document.mapo.slider8.value); 
} 

function GetMapoman(){ 
var mapoman = document.getElementById("mapoprice").value; 
document.getElementById("saru").innerHTML = mapoman; 
} 

function updateTextInput1(val) { 
     document.getElementById('textInput1').value=val; 
    } 

function updateTextInput2(val) { 
     document.getElementById('textInput2').value=val; 
    } 

function updateTextInput3(val) { 
     document.getElementById('textInput3').value=val; 
    } 

function updateTextInput4(val) { 
     document.getElementById('textInput4').value=val; 
    } 

function updateTextInput5(val) { 
     document.getElementById('textInput5').value=val; 
    } 

function updateTextInput6(val) { 
     document.getElementById('textInput6').value=val; 
    }  

function updateTextInput7(val) { 
     document.getElementById('textInput7').value=val; 
    }  

function updateTextInput8(val) { 
     document.getElementById('textInput8').value=val; 
    }  

</script> 

</head> 

<body> 
<form name="mapo" id="mapo" oninput="Add();GetMapoman();GetMapomanPrice();"> 

<input name="slider1" id="slider1" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput1(this.value);" oninput="amount1.value=slider1.value"> 
<input type="text" id="textInput1" value=""> 
<output name="amount1" for="slider1">3</output> 

<input name="slider2" id="slider2" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput2(this.value);" oninput="amount2.value=slider2.value"> 
<input type="text" id="textInput2" value=""> 
<output name="amount2" for="slider2">3</output> 

<input name="slider3" id="slider3" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput3(this.value);" oninput="amount3.value=slider3.value"> 
<input type="text" id="textInput3" value=""> 
<output name="amount3" for="slider3">3</output> 

<input name="slider4" id="slider4" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput4(this.value);" oninput="amount4.value=slider4.value"> 
<input type="text" id="textInput4" value=""> 
<output name="amount4" for="slider4">3</output> 

<input name="slider5" id="slider5" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput5(this.value);" oninput="amount5.value=slider5.value"> 
<input type="text" id="textInput5" value=""> 
<output name="amount5" for="slider5">3</output> 

<input name="slider6" id="slider6" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput6(this.value);" oninput="amount6.value=slider6.value"> 
<input type="text" id="textInput6" value=""> 
<output name="amount6" for="slider6">3</output> 

<input name="slider7" id="slider7" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput7(this.value);" oninput="amount7.value=slider7.value"> 
<input type="text" id="textInput7" value=""> 
<output name="amount7" for="slider7">3</output> 

<input name="slider8" id="slider8" type="range" min="3" max="8" value="3" step="1" style="width:650px" onchange="updateTextInput8(this.value);" oninput="amount8.value=slider8.value"> 
<input type="text" id="textInput8" value=""> 
<output name="amount8" for="slider8">3</output> 

<p><input type="text" name="mapoprice" value="" id="mapoprice" /></p> 

</form> 

<p id="saru"></p> 

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top"> 
<input type="hidden" name="cmd" value="_xclick"> 
<input type="hidden" name="business" value="---.com"><!--put your own email address--> 
<input type="hidden" name="lc" value="GB"> 
<input type="hidden" name="item_name" value="---"><!--put your own item name--> 
<input type="hidden" name="amount" id="finalpaypal"> 
<input type="hidden" name="currency_code" value="GBP"> 
<input type="hidden" name="button_subtype" value="services"> 
<input type="hidden" name="no_note" value="0"> 
<input type="hidden" name="cn" value="Add special instructions to the seller:"> 
<input type="hidden" name="no_shipping" value="2"> 
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted"> 
<input type="image" src="http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal – The safer, easier way to pay online."> 
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1"> 
</form> 

<script> 
function GetMapomanPrice() { 
var mapoman = document.getElementById("mapoprice").value; 
document.getElementById("finalpaypal").value = mapoman; 
} 
</script> 

</body> 
</html>

來源

2014-09-29 15:39:42 awishiki

$(function() { 
 
    $("#slider-range-max").slider({ 
 
     range: "max", 
 
     min: 1, 
 
     max: 10, 
 
     value: 2, 
 
     slide: function(event, ui) { 
 
     $("#amount").val(ui.value); 
 
      $("#amt_id").val(ui.value); 
 
     } 
 
    }); 
 
    $("#amount").val($("#slider-range-max").slider("value")); 
 
    });

<html> 
 
    <head> 
 
    <title>jQuery UI Slider - Range with fixed maximum</title> 
 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css"> 
 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
 
    <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script> 
 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
 
    </head> 
 
    <body> 
 
    <label for="amount">Choose an Amount</label> 
 
    <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> 
 
    <div id="slider-range-max"></div> 
 
    <br><br>  
 
    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top"> 
 
    <input type="hidden" name="cmd" value="_xclick"> 
 
    <input type="hidden" name="business" value="[email protected]"> 
 
    <input type="hidden" name="lc" value="GB"> 
 
    <input type="hidden" name="item_name" value="test"> 
 
    <input id="amt_id" type="hidden" name="amount" value="1"> 
 
    <input type="hidden" name="currency_code" value="GBP"> 
 
    <input type="hidden" name="no_shipping" value="2"> 
 
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted"> 
 
    <input type="image" src="http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal – The safer, easier way to pay online."> 
 
    <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1"> 
 
    </form> 
 
    </body> 
 
    </html>

在這裏你去： JSfiddle

我不知道我理解你的代碼，但我用簡單的jQuery滑塊動態傳遞項目金額的PayPal。

P.S我用Jquery，我認爲應該很容易做滑塊。

來源

2014-09-26 09:58:12 Vimalnath

感謝，Vimal，它看起來不錯，但我是編碼的新手，所以無法弄清楚如何正確運行它......你能夠顯示你的代碼放在哪個位置（head），（body）等等嗎？ – awishiki 2014-09-26 11:47:37

還有一件事，你知道如何使用這個jQuery滑塊製作多個滑塊，並將附加值發送給paypal嗎？ – awishiki 2014-09-26 11:49:35

只看到JSFiddle鏈接，你會看到在哪裏放什麼 – Vimalnath 2014-09-26 12:55:13

發送由<input type =「range」>（滑塊）計算的變量爲PayPal按鈕的價格值<input type =「hidden」name =「amount」>

回答

相關問題