Отключить ссылки с авто создано в раскрывающемся меню JS

Question

Исправлено:

Так что я получил этот кусок JavaScript, который будет отображаться в раскрывающемся меню, когда браузер достаточно мал (сделано с некоторыми @media). Меню создается автоматически в зависимости от меню для большего размера экрана. Теперь моя проблема в том, что он также создает ссылки из «Something1» и «Something2».

Я бы хотел, чтобы они были показаны, но отключены, поэтому не доступны для кликов.

JSFiddle

FIX: Единственное, что должно было быть добавлено, так что он не связан "Something1/2" для не-exsisting страниц был:

<a href="javascript:void(0)"></a> 

HTML

<div class="nav"> 
    <nav> 
     <ul> 
      <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

      </li> 
      <li> <a href="javascript:void(0)">Something1</a> 

       <ul> 
        <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

        </li> 
        <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

        </li> 
       </ul> 
       <li><a href="javascript:void(0)">Something2</a> 

        <ul> 
         <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

         </li> 
         <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

         </li> 
         <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

         </li> 
         <li><a href="#" data-liquidslider-ref="main-slider">Actual Link</a> 

         </li> 
        </ul> 
       </li> 
       <li><a href="#contact" data-liquidslider-ref="main-slider">Actual Link</a> 

       </li> 
     </ul> 
    </nav> 
</div> 

JS

// Create the dropdown base 
$("<select />").appendTo("nav"); 

// Create default option "Go to..." 
$("<option />", { 
    "selected": "selected", 
     "value": "", 
     "text": "Go to..." 
}).appendTo("nav select"); 

// Populate dropdown with menu items 
$("nav a").each(function() { 
    var el = $(this); 
    $("<option />", { 
     "value": el.attr("href"), 
      "text": el.text() 
    }).appendTo("nav select"); 
}); 

$("nav select").change(function() { 
    window.location = $(this).find("option:selected").val(); 
}); 

Есть ли способ сделать это?

Answer 1

Самый простой способ создать пустую ссылку будет как следует,

<a href="#"></a> 

или

<a href="javascript:void(0)"></a> 

Я не уверен, что лучший вариант, но я недавно начал использовать второй вариант. Когда вы используете первый вариант, он добавит символ # в конец вашего URL-адреса, который может испортить активные навигационные ссылки.