如何使用Foundation CSS下拉列表查看ajax搜索結果

我只是試着使用Foundation下拉列表來顯示來自文本輸入字段的ajax搜索結果。有沒有辦法做到這一點？我只想使用下拉列表的樣式來設置我的搜索結果的格式。如何使用Foundation CSS下拉列表查看ajax搜索結果

我剛剛試圖簡單地在頁面上放置一個下拉列表，看看我是否可以在不需要點擊下拉列表或其他目標的情況下看到該列表，但列表拒絕顯示。

<input type="text" placeholder="Search"> 
<ul class="f-dropdown open f-dropdown-open content" data-dropdown-content> 
    <li><a href="#">This is a link</a></li> 
    <li><a href="#">This is another</a></li> 
    <li><a href="#">Yet another</a></li> 
</ul>

免責聲明：我不知道多少基金會還，我試圖修改別人的UI。

我打算只用渲染默認情況下，隱藏着一個額外的hide類的下拉頁面，然後我的Ajax請求後，基本上是做一個jQuery .show()的下拉<ul>之前填充其中的列表。

來源

2016-06-07 BadHorsie

您將需要此代碼，以便它可以將偵聽器重新應用於下拉菜單。您將需要添加類.open來顯示它。

$(document).foundation('dropdown', 'reflow');

來源

2016-06-09 07:58:56

它不需要重新應用任何偵聽器，下載已經在頁面加載中。它已經有'open'類了 - 它不起作用，由於其他CSS，當你從一個按鈕切換下拉菜單時，它只會被Foundation JS刪除。 – BadHorsie

如何使用Foundation CSS下拉列表查看ajax搜索結果

回答

相關問題