2016-11-19 78 views
1

我想追加一個dom元素<a>鏈接到jquery-ui .ui-autocomplete菜單。這工作。Foundation 6揭示模態不能動態添加dom元素

生成的鏈接必須根據原始<input reveal="XXX"> attr傳遞的id參數打開基礎6.2.3模態(基礎揭示模式)。

斷開相位不工作:當id參數是正確的,JS控制檯說:"ReferenceError: We're sorry, 'open' is not an available method for this element." ...

我懷疑基礎靈獸沒有裝到這個動態插入DOM鏈接元素。我怎樣才能解決它?

<input name="item" type="text" placeholder="Item..." class="ac" reveal="addItem"> 

<div id="addItem" class="reveal" data-reveal> 
    TEST 
    <a class="close-reveal-modal" aria-label="Close">&#215;</a> 
</div> 

// http://stackoverflow.com/questions/12479498/jquery-auto-complete-append-link-at-the-bottom 
var test = [ "Item 1", "Item 2", "Item 3", ]; 

$('.ac').autocomplete({ 
      minLength: 0, 
      source: test, 
      open: function(event, ui) { 
      $('.ui-autocomplete').append('<li><a class="reveal-modal" data-open="'+$(this).attr('reveal')+'" title="Inserted text not found... add new item?">...add new item</a></li>'); 
      $('.reveal-modal').click(function(event) { 
       event.preventDefault(); 
       var reveal = '#' + $(this).attr('data-open'); 
       console.log(reveal); 
       $(reveal).foundation('open'); 
      }); 
     }, 
}); 

回答

2

要啓動新的元素上顯示,您的線路$(reveal).foundation('open');前添加new Foundation.Reveal(reveal);

+0

其實...我需要'$(文件).foundation();'在我的腳本... – user2154587