pugテンプレートでAjaxリクエストを送信するには？

Question

私はpugテンプレートファイルでAjaxリクエストを送信したいと思います。

form#payment-form() 
    section 
    label(for="amount") 
     input#amount(name="amount" type="tel" min="1" placeholder="Amount"       value="10") 
script(src="scripts/jquery.js") 
script. 
    (function() { 
    var amount = $('#amount').val(); 
    $.ajax({ 
     type: "POST", 
     url: "/posturl", 
     data: {'amount':amount}, 
     success: function(){}, 
     dataType: 'json' 
    }); 
    })() 

しかし、それはどのように動作しませんか？ は私が

Answer 1

私にはあなたがHTMLコンテンツが 準備ができていることを確認するためにdocument.readyを使用する必要が(function(){

の下で、あなたの機能で不要なタブを入れている二つの問題

1. があるように思われます。あなたが本当にDOMのために気にしない場合は、応答

チェック

doctype html 
html 
    head 
    script(src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js') 
    script. 
     $(document).ready(function(){ 
     $.ajax({url: "demo_test.txt", success: function(result){ 
     $("#div1").html(result); 
     }}); 
     }); 
    body 
    #div1 
     h2 Let jQuery AJAX Change This Text 

以下の実施例を持っていたら、あなたはこれを避けることができます

Answer 2

は、ここで（それが空であり、それはミックスインではありませんので、多分ちょうどあなたが#payment-form()後()を削除することができます）あなたのパグテンプレートに問題がないパグファイルの埋め込まJavaScriptでAJAXリクエストを送信する方法を知りたいです。しかし、あなたのJSで、あなたは即座にAJAXリクエストを送信します。それをイベントにバインドする必要があります（ボタンをクリックする、入力をキー入力するなど）。次に、ライブラリを、ブラウザからアクセスできるディレクトリにscripts/jquery.jsで置いてください。この変更後でもまだ動作していない場合は、エラーをより正確に報告してください（メッセージを受け取るためにコンソールを開いて、期待する動作と取得する動作を取得してください）。