添加值以动态选择字段

如果没有列出，我试图动态地向选择字段添加值。 我有通过jquery生成的动态字段。 我通过表courses_selection_list mysql fetch查询填充这些select字段值。 生成的每个选择字段有三个选项。 我只有在选择Other – Not listed选项时才有隐藏的div节目。 隐藏div中的输入显示我从ajax调用中提取的唯一ID号值。 我现在每次尝试将值递增1时遇到困难Other – Not listed在不同的选择字段中选择Other – Not listed 。 如何将此初始值增加1？ 演示或小提琴

  $(document).ready(function () { $('select').change(function() { var option = $(this).val(); showFields(option); return false; }); var $increment_num = $('#course_increment_num'); var interval = 1000; //3000 = 3 seconds function getCourseId() { $.ajax({ type: 'POST', url: 'courseAutoIncrement.php', data: $(this).serialize(), dataType: 'json', success: function (data) { var $cloned = $('#course_catalog'); var num = parseInt(data); $increment_num.val(num); $cloned.each(function(i){ var $this = $(this); $this.find('[name^="new_course_"]').first().val(num+i); }) }, complete: function (data) { // Schedule the next setTimeout(getCourseId, interval); } }); } setTimeout(getCourseId, interval); function showFields(option){ var content = ''; for (var i = 1; i <= option; i++){ content += '
Course # '+i+'
Course Name: --- Select ---"' prepare("SELECT course_id, course_name FROM courses_selection_list "); $course_query->execute(); $data = $course_query->fetchAll(); foreach ($data as $row){ //dropdown values pulled from database echo 'content += \'' . $row['course_name'] . '\';'; } ?> '"'; content += '
Course IDAdd Course Name to List:
'; } $(document).on('change', "[id^=coursename_]", function () { var $this = $(this); if ($this.val() == "3") { $(this).closest('div').find(".hideNewCourse").show(); } else { $(this).closest('div').find(".hideNewCourse").hide(); } }); $('#course_catalog').html(content); } });  

HTML

 Increment By: 
 How many courses offered?  ---Select--- 1 2 3  
 

Answer 1

这应该这样做：

 ... $('#course_catalog').html(content); $('#course_catalog').find('[id^=coursename_]').on('change', function(){ var $this = $(this); if($this.val() == 3){ $('input[id^=new_course_]').each(function(index){ var start = parseInt($('#course_increment_num').val(), 10); $(this).val(start+index); }) } }); 

您还需要在ajax成功回调中运行.each循环，以确保id是最新的

Answer 2

您可以将值存储在javascript中的全局变量中，并在每次选中“ Other - Not Listed将其递增。 像这样：

 var globalValue = 0; $(document).on('change', "[id^=coursename_]", function () { var $this = $(this); if ($this.val() == "3") { globalValue++; $(this).closest('div').find(".hideNewCourse").show(); } else { $(this).closest('div').find(".hideNewCourse").hide(); } });