的Javascript：添加旁边复选框标签

Question

文字我有这个复选框：

<div id="div_id_diag-diagnosis_option" class="form-group"> 
<label for="id_diag-diagnosis_option_0" class="control-label col-md-3 requiredField"> 
Option<span class="asteriskField">*</span></label> 
<div class="controls col-md-8"><label class="checkbox"> 
<input type="checkbox" name="diag-diagnosis_option" id="id_diag-diagnosis_option_1" value="b" >b</label> 
<label class="checkbox"> 
<input type="checkbox" name="diag-diagnosis_option" id="id_diag-diagnosis_option_2" value="a" >a</label> 
<label class="checkbox"> 
<input type="checkbox" name="diag-diagnosis_option" id="id_diag-diagnosis_option_3" value="c" >c</label> 
</div></div> 

而且我用这个JavaScript的HTML链接添加到每个选定的复选框。

$("input[name='diag-diagnosis_option']").change(function() { 
         if ($(this).prop('checked')) { 
          var option = $(this).val(); 
          alert(option); 
          $(this).after("<a href='#'>here</a>"); 
         } 
        }); 

文本打印在标签的左侧。是否可以在标签后面打印，例如在b的权利？

查看演示here。

预先感谢您！

Answer 1

您需要遍历到父与.parent()和使用jQuery的append()功能：

$(this).parent().append("<a href='#'>here</a>"); 

检查小提琴：

https://jsfiddle.net/ucnepxqt/5/

Answer 2

试试这个 -

$("input[name='diag-diagnosis_option']").change(function() { 
    if ($(this).prop('checked')) { 
     var option = $(this).val(); 
     alert(option); 
     $(this).parent().append("<a href='#'>here</a>"); 
    } 
});