bootstrap-Akkordeon funktioniert nicht richtig

ich versuche mich zu entwickeln bootstrap-Akkordeon und es funktioniert gut in jsfiddle
Aber wenn ich es versuchte in meiner web-app gerade nicht arbeitet.Ich habe anbei der screenshot, wie es aussieht.Wie Sie im screenshot sehen können, gibt es keine Fehler in der Konsole.ich bin auch Folgendes in meiner jsp-Seite

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet"> 
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet"> 
<script type="text/javascript" src="https://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript" src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script> 
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="screen"
     href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">

Selbst hatte ich ersetzt <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> im Ort <script type="text/javascript" src="https://code.jquery.com/jquery.min.js"></script> aber kein Glück.Bitte sagen Sie mir, was brauche ich noch?
bootstrap-Akkordeon funktioniert nicht richtig

Folgenden ist der vollständige code

<%@ page import="java.sql.*" %>
<%@ page import="DB.*" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>send sms</title> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet"> 
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet"> 
<script type="text/javascript" src="https://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript" src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script> 
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="screen"
     href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
</head> 
<body> 
<div class="tabbable" id="myTabs"> 
<ul class="nav nav-tabs"> 

<li class="active"><a href="#tab1" data-toggle="tab">Send Message</a></li> 
<li><a href="#tab2" data-toggle="tab">Users</a></li> 
<li><a href="#tab3" data-toggle="tab">Group Message</a></li> 
<li><a href="#tab4" data-toggle="tab" id="signout">Sign Out</a></li> 
</ul> 
<div class="tab-content"> 
<div class="tab-pane active" id="tab1"> 
<div class="btn-group-vertical pull-right" data-toggle="buttons-radio">

<%
DataBaseConnection db=new DataBaseConnection();
Connection con=db.connet();
PreparedStatement pt=con.prepareStatement("select * from registerSmsUsers");
ResultSet rs=pt.executeQuery();int i=1;
while(rs.next())
{%>
  <button type="button" class="btn btn-primary btn-block" id="<%=rs.getString("mobile")%>"><%=rs.getString("name")%></button>


<%i++;}

%></div>
<div class="container">
        <div class="row">
            <div class="span12">
                <h3>Send SMS to Individual number</h3>
                <form class="form-signin" action="#" method="post" onsubmit="return false;">
                    <div class="row">
                        <div class="span3">
                            Enter Number to send:
                        </div>
                        <div class="span3">
<!-- <input type="text" name="toNumber" id="number" maxlength="13" placeholder="Enter 10 digits number to send" value="+22" /> -->
<!--<input type="text" name="toNumber" id="number" maxlength="13" placeholder="Enter 10 digits number to send" value="+2222"  data-trigger="hover" data-delay='{"show":"10", "hide":"3000"}'/>-->
<input type="text" name="toNumber" id="number" maxlength="13" placeholder="Enter 10 digits number to send" value="+2222" rel="popover" data-trigger="hover" />

                        </div>
                        <!--<div class="span6">
                            <div class="alert">
                                <button type="button" class="close" data-dismiss="alert">&times;</button>
                                Please enter 10 digit mobile number prefixed by country code eg +911234567890<hr />

                            </div>
                        </div>-->
                    </div>
                    <div class="row">
                        <div class="span3">
                            Enter Message to send:
                        </div>
                        <div class="span3"> <div id="datetimepicker" class="input-append date"> 
<input style="display:none" type="text" name="body" maxlength="160" placeholder="Enter message to send" class=".dtext" id="body" data-trigger="hover"/> 
<input type="text" id="txt" style="display:none"/> 
<textarea rows="9" cols="50" class="darea1" id="darea"></textarea><span class="add-on"> 
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i> 
</span> 
</div> 
</div> 
                        <!--<div class="span6">
                            <div class="alert">
                                <button type="button" class="close" data-dismiss="alert">&times;</button>
                                The text of the message you want to send, limited to 160 characters.
                            </div>
                        </div>-->
                    </div>
                    <div class="row">
                        <div class="span3">
                        </div>
                        <div class="span9">
                            <button class="btn" type="submit" id="openAlert" >Send</button>

                        </div>
                    </div>
                </form>
            </div>
        </div>


 <div id="le-alert" class="alert alert-warn alert-block fade">
      <button href="#" type="button" class="close">&times;</button>
      <h4>Successful</h4>
      <p>Message sent successfully</p>
    </div>
    </div>
</div> 
<!-- 2nd tab strats -->
<div class="tab-pane" id="tab2"> 



 <form class="well span9" action="insertNew" method="post"> 
<div class="row"> 
<div class="span3"> 
<label>Name</label> 
<input type="text" id="fields" class="span4" placeholder="Your full Name" name="username" required> 

</div> 
<div class="span3"> 

<label>Email Address</label> 
<input type="email" id="fields1" class="span4" placeholder="Your email address" name="email" required> 
</div> 
<div class="span3"> 
<label>Mobile</label> 
<input type="tel" id="fields2" class="span4" placeholder="+756762462182" name="mobile" maxLength="13" required > 
</div> 
</div> 
<input type="button" id="btn1" class="btn btn-lg btn-primary" value="Add">
</form> 
    <input type="button" id="btn2" class="btn btn-lg btn-primary" value="Group">

<!-- accordion strats-->

<div class="accordion" id="accordion2">
    <div class="accordion-group">
        <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
                records
            </a>
        </div>
        <div id="collapseOne" class="accordion-body collapse in">
            <div class="accordion-inner">
<table border="1" id="mytable" class="table"/>
<tr>
<th>Add</th>
<th>Username</th>
<th>EmailId</th>
<th>Mobile No</th>
</tr>
</table>            </div>
        </div>
    </div>
    <div class="accordion-group">
        <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
                Collapsible Group Item #2
            </a>
        </div>
        <div id="collapseTwo" class="accordion-body collapse">
            <div class="accordion-inner">
groups here         </div>
        </div>
    </div>
</div>

<!-- accordion ends-->
<!--<table border="1" id="mytable" class="table"/>
<tr>
<th>Add</th>
<th>Username</th>
<th>EmailId</th>
<th>Mobile No</th>
</tr>
</table>-->
</div> 
<!-- 2nd tab ends -->
<div class="tab-pane" id="tab3"> 
<p>para in section 3</p> 
</div> 
</div> 
</div> 
<script> 
$(function() { 
$("#datetimepicker").datetimepicker({ 
format: "'dd/MM/yyyy hh:mm:ss'", 
linkField: "#txt", 
linkFormat: "yyyy-mm-dd hh:ii", 
autoclose: true, 
}); 

jQuery('#datetimepicker').datetimepicker().on('changeDate', function(ev){ 
$(".darea1").val($( ".darea1" ).val()+$( "#txt" ).val()); 
}); 

}); 

</script> 
<script> 
$('#tabAll').click(function(){ 
$('#tabAll').addClass('active'); 
$('.tab-pane').each(function(i,t){ 
$('#myTabs li').removeClass('active'); 
$(this).addClass('active'); 
}); 
}); 
$('body').on('click', '.btn', function(){ 
if(this.id=='openAlert')
    {$('#number').val('');}else{$('#number').val(this.id);}
});
</script> 
<script >



        $(document).ready(function(){
$("#signout").click(function() { 
    window.location.replace("logout.jsp"); 
});
//next line
var val=0;
$(document).ready(function(){


  $('#btn1').click(function(){
      if($(".span4").val()!="")
      {
  $("#mytable").append('<tr id="mytr'+val+'"></tr>');
  $("#mytr"+val).append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr'+val+'" checked ></td>');

             $(".span4").each(function () {

             $("#mytr"+val).append("<td >"+$(this).val()+"</td>");

              });
              val++;
      }
      else
      {
          alert("please fill the form completely");
      }
              });
    $('#btn2').click(function(){
        var creat_group=confirm("Do you want to creat a group??");
        if(val>1){
           alert(creat_group);


              }
    });




});

//
        $('#openAlert').click(function(){

            var number = $('#number').val(); //If its a text input could use .text()
            var msg = $('#darea').val(); //If its a text input could use .text()
alert(msg);
            $.ajax(
                {
                    type: "POST",
                    url: "messageSending.jsp", //Your full URL goes here
                    data: { toNumber: number, body: msg},
                    success: function(data, textStatus, jqXHR){
                        alert(data);                  
                    },
                    error: function(jqXHR){
                        alert(jqXHR.responseStatus);
                    }
                });
        });
    });
        </script>
<script>  
$(function ()  
{ $("#number").popover({title: 'Enter Mobile Number',content: "Please enter 10 digit mobile number prefixed by country code eg +911234567890"});  
});  
$(function ()  
{ $("#body").popover({title: 'Message Body',content: "Maximum 160 characters allowed"});  
});
</script>  
  <script type="text/javascript"
     src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
    </script> 
    <script type="text/javascript"
     src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
    </script>

</body>
</html>
warum Sie diese <link href="getbootstrap.com/2.3.2/assets/css/bootstrap.css" > <link href="getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" > in der letzten, die Sie Hinzugefügt so kombiniert nicht brauchen
finden Sie jetzt
sorry nicht verstanden
check-in Geige, die Sie nicht brauchen, um die css 's seperat,kombiniert alle diese
Auch entfernen Sie das überschüssige CSS/JS etc. und bauen Sie wieder auf. Eindeutig die Antwort gegeben unten und deins immer noch nicht funktioniert, bauen Sie es wieder auf, oder geben Sie den code. Es wird schwierig sein, für die ppl zu helfen, sonst.

InformationsquelleAutor SpringLearner | 2013-10-29

Schreibe einen Kommentar