向Stripe JS按鈕添加事件監聽器

<script 
src="https://checkout.stripe.com/checkout.js" class="stripe-button" 
data-key="pk_test_dNbyQ3qsyTe8IAikxSfnLhBl" 
data-amount= <%= number_to_currency(@shopping_cart.total) * 100 %> 
data-name="Abound" 
data-description="Checkout" 
data-image="https://stripe.com/img/documentation/checkout/marketplace.png" 
data-locale="auto"> 
document.querySelectorAll('.stripe-button').addEventListener('click',function(){ 
    <%= @shopping_cart.clear %> 
}

這是一個處理付款的分條按鈕。問題是Eventlistener。每次刷新頁面或轉到其他頁面時，ruby代碼都會執行並清除我的購物車。有人有主意嗎？即使我改變js使其無效ruby得到執行，你也可以解釋這一點？向Stripe JS按鈕添加事件監聽器

全頁面加載：

<h1>Shopping Cart Contents</h1> 
    <div style="font-size: 14px; "> <%= render :partial => 'shopping_cart_item', :collection => @shopping_cart.shopping_cart_it ems %> </div> 
    <div style="font-size: 18px;"><strong>Total:</strong><%= number_to_currency (@shopping_cart.total) %></div> 
    <form> 
    <script 
    src="https://checkout.stripe.com/checkout.js" class="stripe-button" 
    data-key="pk_test_dNbyQ3qsyTe8IAikxSfnLhBl" 
    data-amount= <%= number_to_currency(@shopping_cart.total) * 100 %> 
>> data-name="Abound" 
    data-description="Checkout" 
    data-image="https://stripe.com/img/documentation/checkout/marketplace.png" 
    data-locale="auto"> 
    document.querySelectorAll('.stripe-button').addEventListener('click',function(){ 
     <%= @shopping_cart.clear %> 
    } 
    </script> 
    </form> 

    </div>

編輯：我最終什麼事做的車是剛剛創建一個新的視圖頁面，因爲紅寶石加載服務器端，因此沒有發揮很好地嵌入JS。

來源

2017-04-09 user7811328

如何評估插值？當您加載頁面時，實際HTML中有什麼？ –

如何添加一個事件監聽器按鈕與頁面刷新時在服務器上清除服務器有什麼關係？這聽起來像一個[XY問題]（https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem） – charlietfl

@aluan我添加了完整的文件 – user7811328

紅寶石運行在服務器....不是在瀏覽器中的JavaScript ......是相反

你的問題是，<%= @shopping_cart.clear %>將在服務器每次執行......不是當瀏覽器中的事件觸發。

我建議你使用ajax發送一些東西給服務器，然後根據需要清除購物車

來源

2017-04-10 00:32:49 charlietfl

向Stripe JS按鈕添加事件監聽器

回答

相關問題