jQueryフォームのサブミットが呼び出されない

Question

私は、この練習ボタンをクリックしてdiv要素にhtml要素を追加するこのコードを持っています。しかし、フォームの送信ボタンをクリックすると、 "Selected Practice Option"が呼び出されません。しかし、私のウェブサイト上の私の他のフォームは、「選択された練習のオプション」と呼ばれています。このコードでは、 "Selected Practice Option"のjQueryイベントは呼び出されません。 jQueryコードとhtmlコードにエラーはありません。これはjQueryのエラーですか？ $("#ob-practice")上clickで

/* Pratice Button Clicked Event */ 
    - 35  $("#ob-practice").click(function(){ 
    2 36   $("#newComboDiv").css("display","none"); 
    2 37   $("#practiceComboDiv").css("display","inline-block"); 
    2 38   var data = JSON.parse(localStorage.getItem('c')); 
    2 39   var text = "<form id='comboselect' action='#'> <select name='option-name'>"; 
    - 40   for (var i in data){ 
    3 41    var m = data[i]; 
    3 42    text += "<option> " + m.name + "</option>"; 
    3 43   } 
    2 44   text += "</select>" 
    2 45   text += "<button type='submit' value='submit'> Submit </button> </form>" 
    2 46   $("#combo-menu").html(text); 
    2 47  }); 
    | 48  /*Selected Practice Option */ 
    - 49  $("form").on("submit",function(e){ 
    2 50   e.preventDefault(); 
    2 51   var data = $('#comboselect').serializeArray(); 
    2 52   alert("test"); 
    2 53 
    2 54  }); 

Answer 1

、<form id='comboselect'>を動的に$("#combo-menu")要素内の子として作成されます。タグ名formを持つその子へ$("#combo-menu")から

てみ「代表団は、」：

$("#combo-menu").on("submit","form",function(e){ 
    e.preventDefault(); 
    var data = $('#comboselect').serializeArray(); 
    alert("test"); 
}); 

Answer 2

あなた$("#ob-practice").click(function(){は、そのクリックイベントが発生するまでページにはフォームがないことを意味し、フォーム

を作成し

あなたのコードはリスナーを追加して提出イベント$("form").on("submit",function(e){を作成しますが、これはフォームが存在する前に実行されます

あなたが必要...いまいましい、真剣に、他の回答で、ほぼ20分間誰も答えを殴られ、BAM ...一度に2つの答え：P

OK、あなたも移動することができ、この

を保存することができますコードスニペットの末尾に47行...フォームが

- 35  $("#ob-practice").click(function(){ 
2 36   $("#newComboDiv").css("display","none"); 
2 37   $("#practiceComboDiv").css("display","inline-block"); 
2 38   var data = JSON.parse(localStorage.getItem('c')); 
2 39   var text = "<form id='comboselect' action='#'> <select name='option-name'>"; 
- 40   for (var i in data){ 
3 41    var m = data[i]; 
3 42    text += "<option> " + m.name + "</option>"; 
3 43   } 
2 44   text += "</select>" 
2 45   text += "<button type='submit' value='submit'> Submit </button> </form>" 
2 46   $("#combo-menu").html(text); 
| 48   /*Selected Practice Option */ 
- 49   $("form").on("submit",function(e){ 
2 50    e.preventDefault(); 
2 51    var data = $('#comboselect').serializeArray(); 
2 52    alert("test"); 
2 53 
2 54   }); 
2 47  });