2014-05-17 143 views
0

enter image description heregmap3 DOM按鈕不能正常工作

這是我正在使用的UI。輸入一個地址,點擊「See On Map」並出現一個標記。如果您點擊標記,則會出現「添加成員詳細信息」按鈕。

我需要它,以便當用戶單擊「添加成員詳細信息」按鈕時,將出現一個模式表單。現在,它不起作用。我沒有收到任何錯誤。它只是一個空白的按鈕。我試圖發起警報,但一無所獲。

我已經測試過,看看我的模態是否在另一個按鈕啓動時工作,並且效果很好 - 我認爲我的問題是因爲「添加成員詳細信息」按鈕是一個DOM生成按鈕。誰能幫忙?

使用Twitter的引導(3.0),GMAP 3.0,BootBox.js和jQuery 1.10

$('.init_form').click(function(e){ 
    $('#dialog-demo-1').modal(); 
    e.preventDefault(); 
}); 


function seeOnMap(xaddress) { 
     $('#gmap-4').gmap3({ 
       marker:{ 
       address: xaddress, id:'newuser_marker', data:"<div><button type='button' class='btn btn-success init_form' id='newmember_form'>Add Member Details</button></div>", 
       events:{ 
        click: function(overlay, event, context){ 
         var map = $(this).gmap3("get"), 
          infowindow = $(this).gmap3({get:{name:"infowindow"}}); 
         if (infowindow){ 
          infowindow.open(map, overlay); 
          infowindow.setContent(context.data); 
         } else { 
          $(this).gmap3({ 
          infowindow:{ 
          anchor:overlay, 
          options:{content: context.data} 
         } 
        }); 
       } 
      }, 
       } 
       }, 
         map:{ 
       options:{ 
        center: [xx.xxxxxx,xx.xxxxxx], 
        zoom: 11 
       } 
       } 
     }); 
    } 

而這裏的HTML:

<div id="dialog-demo-1" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title">Signup form</h4> 
      </div> 
      <div class="modal-body"> 
       <form> 
        <div class="row"> 
         <div class="col-sm-4"> 
          <label>Name</label> 
         </div> 
         <div class="col-sm-8"> 
          <input type="text" class="form-control" />  
         </div> 
        </div> 
       </form> 
       </div> 
      </div> 
      </div> 
     </div> 

回答

0

啊,好,我終於想通了:

應該是:

$(document).on('click','.init_form',function(e){ 
     $('#dialog-demo-1').modal(); 
     e.preventDefault(); 
    });