向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按钮添加事件监听器

回答

相关问题