JQUERY、IDを選択

Question

一般に、フォームを作成します。 'add-question-btn'によって、私は新しい質問をフォームに追加します。私たちは、所有者（著者）として、ドロップダウンリストから選択することによって、回答の種類が何であるかを決定する必要があるので、多くの質問をすぐに追加することができます。

var num_question_options = [0]; 
var num_questions = 1; 

$('#add-question-btn').click(function() { 
    $('.questions').append(
     '<div class="questions-div" id="question-' + num_questions + '">' + 
     '<label id="question-label" for="question-text">id:' + num_questions + '</label>' + 
     '<input class="form-control" id="question-text" type="text" placeholder="Pytanie"/>' + 
     '<div class="select-select-type">' + 
     '<div class="dropdown">' + 
     '<select title="type" class="select-type form-control" id="select-' + num_questions + '">' + 
     '<option value="text">Krótka odpowiedz</option>' + 
     '<option value="radio">Wielokrotny wybór</option>' + 
     '<option value="checkbox">Pola wyboru</option>' + 
     '<option value="menu">Menu</option>' + 
     '<option value="scale">Skala liniowa</option>' + 
     // tego na razie nie bedzie 
     // '<option value="table">Siatka wielokrotnego wyboru</option>' + 
     '<option value="date">Data</option>' + 
     '<option value="hour">Godznia</option>' + 
     '</select>' + 
     '</div>' + 
     '<ul id="answers" class="list-unstyled"></ul>' + 
     '</div>' 
    ); 
    num_question_options[num_questions] = 0; 
    num_questions++ 
}); 

は、選択した回答タイプに応じて、我々は（著者として）可能な答えを入力するための場所を受けるべきです。これは私の選択したオプションの変更を検出する機能です。

問題は、どのようにsthを追加するべきかを知るために、その関数内のselect IDを見つける方法です。

$(document).on('change','select',function(){ 
    var select_val = this.value; 
    var field_val = parseInt($(this).attr("id")); //THIS IS PROBLEM 
    alert(field_val); 
    switch (select_val) { 
     case 'text': 
      alert('TESTtext'); 
      break; 
     case 'radio': 
      alert('TESTradio'); 
      var question = $('div.questions-div#question-' + field_val); 
      var id = { 
       questionId: field_val, 
       optionId: num_question_options[field_val] + 1 
      }; 
      question.find('ul#answers').append(
       '<li>' + 
       '<input class="form-control" ' + 
       'title="answer" ' + 
       'id="answer-' + num_question_options[field_val] + '" ' + 
       'type="text" ' + 
       'onfocus="add_option(' + id.questionId + ', +' + id.optionId + ')" ' + 
       'onblur="remove_option(' + id.questionId + ', +' + id.optionId + ')" />' + 
       '</li>' 
      ); 
      num_question_options[field_val]++; 
      break; 
     case 'checkbox': 
      alert('TESTcheckbox'); 
      break; 
     case 'menu': 
      alert('TESTmenu'); 
      break; 
     case 'scale': 
      alert('TESTscale'); 
      break; 
     case 'date': 
      alert('TESTdate'); 
      break; 
     case 'hour': 
      alert('TEShour'); 
      break; 
    } 
}); 

Answer 1

問題はparseIntのようです。 select-IDを整数に変換することはできませんが、NANを返します。このようにしてみてください。

var field_val = parseInt($(this).attr("id").replace(/[^\d]/g,'')); 

これはint型に解析する前に、すべての非数字文字をフィルタリングします。ですから、$(this).data('questionId')で質問IDを取得することができます

<select data-question-id="123"> ... </select> 

：

別possibileソリューションは次のようにデータの属性を使用することです。

また、マークアップを確認する必要があります。 3つの開始divタグと2つの終了タグがあるようです。