jQuery 不接收 .on('submit', function(e) 或 e.preventDefault();

Question

出于某种原因，我的 jQuery 没有接收到 #betButton click/submit，有人知道为什么吗？在过去的一两个小时里一直在尝试修复它，但从来没有运气。任何帮助将不胜感激。 :)

$(function() {    
$("#betButton").on('submit', function(e) {
       e.preventDefault();

   var $form = $(this),
   data = "betAmount=" + $form.find("#betAmount").val() + "choice=" + $('input[name=choice]:checked').val(),
   url = $form.attr("action");
   if($.trim($form.find("#betAmount").val()) === ''){
   }else{
     $.ajax({
       type: "POST",
       url: url,
       data: data,
       success: function(response){
         //$form.find("#betAmount").attr("disabled", true);
         //$form.find('#betButton').attr("disabled", true);
         //$("input[type=radio]").attr('disabled', true);
         if(repsonse.indexOf("Bet already made") >= 0){
           $('#mMessage').find('.modal-content').val("You've already placed your bet.");
           $('#mMessage').modal('show');
         }else{
           $('#mMessage').find('.modal-content').val("Your bet has been placed successfully.");
           $('#mMessage').modal('show');
         }
       }
     })
   }
 });
});

<form action="/models/coinroulette.php" method="POST">
            <div class="panel panel-default">
               <div class="panel-heading panelHNew">Make a Bet</div>
               <div class="panel-body">
                  <div class="form-group padding-top">
                     <p class="padding-left">Enter in a bet amount and select a coin (heads or tails).</p>
                     <div class="col-lg-8">
                        <div class="input-group">
                           <span class="input-group-addon">
                           <i class="glyphicon glyphicon-gift"></i>
                           </span>
                           <input class="form-control" placeholder="Bet Amount" id="betAmount" name="betAmount" type="number" autofocus>
                        </div>
                     </div>
                     <div class="col-lg-4">
                        <label style="margin-left: -10px;">
                        <input type="radio" name="choice" value="heads" class="noRButton"/>
                        <img class="profile-img" src="../resources/img/coinroulette/heads.png" alt=""/>
                        </label>
                        <label>
                        <input type="radio" name="choice" value="tails" class="noRButton"/>
                        <img class="profile-img" src="../resources/img/coinroulette/tails.png" alt=""/>
                        </label>
                     </div>
                     <div class="col-lg-12">
                        <div class="form-group padding-top">
                           <button type="submit" id="betButton" class="btn btn-lg btn-primary btn-block">Place Bet</button>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </form>

Answer 1

按钮没有提交事件。

改为将事件移至表单：

$("form").on('submit', function(e) {
  ...
});

您还需要进行拼写更正（repsonse 而不是 response）：

if(repsonse.indexOf("Bet already made") >= 0){

并且不需要使用 find() 来获取具有 ID 的元素。变化：

$form.find("#betAmount").val()

…至：

$("#betAmount").val()

jQuery 不接收 .on('submit', function(e) 或 e.preventDefault();

jQuery not picking up .on('submit', function(e) or e.preventDefault();

jquery

submit

preventdefault