Javascript 图标切换引导3和JQuery验证-功能不正确

Javascript 图标切换引导3和JQuery验证-功能不正确,javascript,jquery,twitter-bootstrap,Javascript,Jquery,Twitter Bootstrap,我一直在编写所附的代码,出于某些(可能很明显的)原因,我的图标切换不起作用。有什么想法吗 我知道我已经正确地转换了var collapse,其他部分正在工作,并且我已经将警报添加到标记进程(稍后我将删除这些警报并将其移动到控制台) 这是HTML- <!-- Panel - Start Panel 5 --> <div class='panel panel-default'> <div class='panel-heading'> <h4 class=

我一直在编写所附的代码,出于某些(可能很明显的)原因,我的图标切换不起作用。有什么想法吗

我知道我已经正确地转换了var collapse,其他部分正在工作,并且我已经将警报添加到标记进程(稍后我将删除这些警报并将其移动到控制台)

这是HTML-

 <!-- Panel - Start Panel 5  -->
<div class='panel panel-default'>
<div class='panel-heading'>
<h4 class='panel-title'>
Phone and Email
<i class='indicator glyphicon glyphicon-question-sign  pull-right'></i>
</h4>
</div>
<div id='pnl_agency_contact' class='panel-collapse collapse'>
<div class='panel-body'>

<div class='form-group'>
<label>Agency Primary Phone</label>
    <div class='input-group'>
    <span class='input-group-addon'><i class='fa fa-phone'></i></span>
    <input type='text' class='form-control' id='phone' name='phone' value='' required >
    </div>

</div>
<script> 
$(document).ready(function() {
    $('#phone').mask('(999) 999-9999',{placeholder:'#'});
});
</script>

<div class='form-group'>
<label>Agency Primary Fax</label>
    <div class='input-group'>
    <span class='input-group-addon'><i class='fa fa-phone'></i></span>
    <input type='text' class='form-control' id='phone_fax' name='phone_fax' value='' required >
    </div>

</div>
<script> 
$(document).ready(function() {
    $('#phone_fax').mask('(999) 999-9999',{placeholder:'#'});
});
</script>

<!-- Form Text Input Required -->
<div class='form-group'>
<label>Agency Primary Email</label>
<div class='input-group'>
<span class='input-group-addon'><i class='fa fa-pencil'></i></span>  
<input type='email' id='email' name='email'  value='' class='form-control'  >
</div>
</div>



<a href='#' id='btn_step_two' name='btn_step_two' class='btn btn-success pull-right continue'>Next Step</a>
</div>
</div>
</div>
<!-- Panel - End  -->

您可以发布一个JSFIDLE或更多的代码吗?添加了html-代码引用了jquery验证。
function toggleChevron(e) {
        $(e.target)
            .prev('.panel-heading')
            .find("i.indicator")
            .toggleClass('glyphicon-question-sign glyphicon-ok-sign');
    }

$('.continue').click(function(e){
    e.preventDefault();
    var sectionValid = true;

    var collapse = $(this).closest('.panel-collapse.collapse');
    alert ('Checking Step Validation of ' + collapse.attr('id'));
        $.each(collapse.find('input, select, textarea'), function(){
            if(!$(this).valid()){
                $(this).parent('.form-group').addClass( "has-error has-feedback" );
                sectionValid = false;
                }
            else{
                $(this).parent('.form-group').removeClass("has-error has-feedback");
                $(this).parent('.form-group').addClass( "has-success has-feedback" );
                }   
            });

    if(sectionValid){
        alert ('Step Validate Complete!');
        collapse.collapse('toggle');
        toggleChevron(collapse);        
        collapse.parents('.panel').next().find('.panel-collapse.collapse').collapse('toggle');
    }

});