2014-10-17 3 views
2

부트 스트랩 팝 오버에 문제가 있습니다. 버튼이 있습니다.이 버튼을 클릭하면 양식이 표시됩니다. 단추가있는 양식에서는이 단추를 클릭하면 경고가 나타납니다. 그러나 내가 그것을 클릭하면, 그것은 어떤 것을 경고하지 않습니다. 왜 작동하지 않는지 모르겠다. 너 나 좀 도와 줄 수 있니? 여러분 모두에게 감사드립니다!부트 스트랩 팝 오버에서 버튼을 클릭 할 수 없습니다.

<script src="//code.jquery.com/jquery.js"></script> 
 
\t <!-- Latest compiled and minified CSS & JS --> 
 
\t <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
 
\t <script> 
 
\t \t $(document).ready(function() { 
 
\t \t $('#form_popover #ok').click(function(){ 
 
\t \t \t \t alert("hi"); 
 
\t \t }); 
 
\t \t $('.btn-open-popover').popover(); 
 

 
\t \t // //popover option 
 
\t \t $("#a-popover").popover({ 
 
\t \t  title: 'Dang ki thong tin', 
 
\t \t  content: $('#divContentHTML').html(), 
 
\t \t  placement: 'right', 
 
\t \t  html: true 
 
\t \t }); 
 
\t \t }); 
 
\t </script>
<link rel="stylesheet" media="screen" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
\t <div class="col-xs-5 col-sm-5 col-md-5 col-lg-5"> 
 
\t \t <a href="#" class="btn btn-default" id="a-popover">Click!</a> 
 
     <div id="divContentHTML" style="display:none"> 
 
     <form method="post" id="form_popover"> 
 
      \t <div class="form-group form-inline kc"> 
 
      \t \t <label for="">Name</label> 
 
      \t \t <input type="text" class="form-control" id="user" placeholder="Input field"> 
 
      \t \t <label for="">Email</label> 
 
      \t \t <input type="text" class="form-control" id="email" placeholder="Input field"> 
 
      \t </div> 
 
      \t <button type="button" id="ok" class="btn btn-primary">OK</button> 
 
      </form> 
 
     </div> 
 
\t </div>

답변

3

대한 이벤트 대리자를 사용 매니저. 예 :

$(document).on('click', '#ok', function() 
{ 
    alert("hi"); 
}); 

Fiddle.

또는 정적 <div class="col-xs-5 col-sm-5 col-md-5 col-lg-5">와 조금 더 :

$('.col-xs-5').on('click', '#ok', function() 
{ 
    alert("hi"); 
}); 

Fiddle.

1

당신은 위임 된 이벤트를 사용한다,이 버튼을 동적으로로드 된 (또는 초기화)되기 때문에 동적으로 생성 elemnts

$(document).on('click', '#ok',function(){ 
      alert("hi"); 
}); 

Demo

관련 문제