如何將HTML表格放入下拉框中？

如何將HTML表格放入下拉框中？所以，像這樣：如何將HTML表格放入下拉框中？

<select> 
    <table></table> 
</select> 

or 

<select> 
    <option> 
     <table></table> 
    </option> 
</select>

來源

2012-11-14 user1778595

你有什麼想法，你想達到什麼目的，你想每個單元格可選或整個表等等 –

標準將會說不，但是當你在瀏覽器中嘗試時會發生什麼？ –

是你的唯一選擇嗎？如果沒有，我會說去手風琴...它會容易得多.. – Scorpio

純CSS和HTML這是不可能的。

javascript可能是您處理此問題的最佳方法。使用jquery也將幫助你的JavaScript巨大

來源

2012-11-14 17:27:59 blapsley

如何做到這一點？你知道任何網站，或有一個示例代碼？我真的很感激。 – user1778595

不，因爲我從來沒有見過這樣做的理由 – blapsley

如果你想這樣做，你將需要一些自定義的自制元素。在<option>標記中沒有允許其他HTML標記。

查看正在增強標準select元素的javascript庫，例如Chosen。也許你可以在那裏得到一些關於如何實現你的表邏輯的靈感。

來源

2012-11-14 17:28:29

如何創建自定義標籤，我從未做過沙發？ – user1778595

需要一點Javascript/jQuery技能來實現這一點。您必須通過創建由標準HTML元素組成的自己的解決方案來基本模擬選擇。 –

我認爲你不能這樣做，你必須刺激。

您需要構建一個具有多行的div，並將向下箭頭添加到第一行以使其看起來像dropdownlist。

來源

2012-11-14 17:31:51

有意義。我可以在1個div標記下拉列表，並在另一個div標記中顯示錶格。之後，我可以根據需要隱藏/顯示HTML表格。 – user1778595

有意義。我可以這樣做： – user1778595

雖然你可以做到這一點的方法：

$('select option').append('<table><tr><td>value</td></tr></table>');

更多的選擇

$('select option:eq(0)').append('<table><tr><td>value</td></tr></table>'); 
$('select option:eq(1)').append('<table><tr><td>value</td></tr></table>'); 
$('select option:eq(2)').append('<table><tr><td>value</td></tr></table>');

來源

2012-11-14 17:36:50 Jai

這與問題中的示例代碼有何不同？ – insertusernamehere

@insertusername這裏提出了一個問題：「我怎樣才能把HTML表格放入DropDownbox？」並且這個ans根據需要來做。 – Jai

我試過了，但沒有奏效。我只顯示文字。我沒有邊框和多行。 – user1778595

你想實現什麼只用select - 標籤是不可能的。在此標籤內只有optgroup - 和option-標籤是允許的。參見w3c.org：「17.6 The SELECT, OPTGROUP, and OPTION elements」。

當我們繼續閱讀option-tag時，您會看到內容模型僅允許在此元素中使用text。再次在w3c.org上：「4.10.12 The option element」

因此，唯一能夠實現這一目標的方法是使用其他HTML元素創建一個看起來和行爲類似於option -tag的元素。

在這demo on jsfiddle你可以看到一個例子，一個可能的解決方案如何看起來像。這一個沒有JavaScript，因爲內容顯示在:hover。但是，當然，您可以使用JavaScript或jQuery將其更改爲click -event。

來源

2012-11-14 18:27:21 insertusernamehere

好的，讓我試試。我會發布代碼，一旦我完成。謝謝。 – user1778595

如何將HTML表格放入下拉框中？

回答

相關問題