2016-09-09 63 views
0

我放棄了Bootstrap彈出窗口,並開始尋找。我找到了WebUI Popover,它具有我期待的所有功能。WebUI Popover無法使用html元素設置標題

但我無法使用頁面上元素的html內容設置彈出窗口的標題。我在console.log()中獲得undefined,標題加載爲空。我試圖訪問的html是動態創建的。

我認爲插件中存在一個錯誤是內容從頁面上的另一個元素完全加載。

I have a FIDDLE here.

我的Web用戶界面酥料餅的代碼是:

// Popover Menu initialize 
    $('.icon-popover-menu').webuiPopover({ 
    placement: 'left', 
    trigger: 'click', 
    closeable: true, 
    multi: false, 
    animation: 'pop', 
    cache: 'false', 
    type: 'html', 
    width: '220', 
    title: function() { 
     return $(this).closest('td.row-icon').find('.btn-row-popover-menu-head').html(); 
    }, 
    content: function() { 
     return $(this).closest('td.row-icon').find('.btn-row-popover-menu-body').html(); 
    } 
    }); 

    // Hide popover when screen changes size 
    $(window).on('resize', function() { 
    WebuiPopovers.hideAll(); 
    }); 
    $(window).on('scroll', function() { 
    WebuiPopovers.hideAll(); 
    }); 

我的HTML的樣品是:

<table class="fiddle"> 
    <tr> 
    <td class="row-icon"> 
     <button class="icon-popover-menu ion-fw btn-row-popover-menu">BTN</button> 
     <div style="display:none;"> 
     <div class="btn-row-popover-menu-head"> 
      <span>THIS IS THE TITLE</span> 
     </div> 
     <div class="btn-row-popover-menu-body"> 
      <div class="input-group" role="group"> 
      <a class="btn btn-app btn-icon-menu btn-popover-first" href="#"> 
       EDIT 
      </a> 
      <a class="btn btn-app btn-icon-menu-danger" href="#"> 
       DELETE 
       <br> 
       <span class="transaction-menu-legend">DELETE</span> 
      </a> 
      </div> 
     </div> 
     </div> 
    </td> 
</table> 

任何幫助表示讚賞。

回答

1

title: function() { return $(event.target).closest('td.row-icon').find('.btn-row-popover-menu-head').html(); },

這工作正常。通過執行$(this)您試圖訪問彈出窗口的標題元素,該元素顯然沒有最接近的td.row-icon。因此它是不確定的。

+0

嗨@Surya,表中有很多行從後端數據庫動態地收集。我無法將它指向課程,因爲它需要成爲當前行的一個。而且,相同的命令適用於身體。如果我使用身體的命令到標題上,它也是未定義的。 – TheRealPapa

+0

各個按鈕的按鈕也不同嗎? – Surya

+0

嗨@Surya,我只是更新了小提琴,以顯示如何多行。每行有不同的按鈕。爲什麼內容有效,而不是標題? – TheRealPapa