[英]Unable to make responsive navigation
我正在使網站響應。 我正在使用以下代碼將導航作為移動設備的選擇框。 但是代碼不起作用。 我想念什么嗎?
<nav id="main-nav">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<!--START: menuitems_view-->
<!--START: TOP_LINK_FORMAT-->
<td nowrap="nowrap">
<a href="infopage.asp?page=[link_id]"
class="menu" target="[link_target]">
[link_name]
</a>
</td>
<!--END: TOP_LINK_FORMAT-->
<!--END: menuitems_view-->
</tr>
</table>
<select></select>
腳本代碼如下:
<script>
$(document).ready(function() {
//Appending Select in NAv for Small Resolutions Devices
// Create the dropdown base
$("<select />").appendTo("#main-nav");
// Create default option "Go to..."
$("<option />", {
"selected": "selected",
"value" : "",
"text" : "Site Navigation..."
}).appendTo("#main-nav select");
// Populate dropdown with menu items
$("#main-nav a, #main-nav a").each(function() {
var el = $(this);
$("<option />", {
"value" : el.attr("href"),
"text" : el.text()
}).appendTo("#main-nav select");
});
$("#main-nav select").change(function() {
window.location = $(this).find("option:selected").val();}
);
});
</script>
首先,我不確定您要實現什么目標,所以只寫一些我看到的錯誤。
首先,HTML損壞的導航標記缺少結束標記。
另一件事是,您已經在nav標簽的末尾有了select標簽,但是您仍然可以通過jQuery創建自己的標簽.appendTo("#main-nav select")
會同時添加這兩個選項。 如果只想刪除一個<select></select>
除此之外,選項的創建很好,並且更改事件有效。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.