Загрузите Div из меню нажмите

Я использую следующий код, чтобы загрузить страницу в моей основной DIV, когда пользователь нажимает на пункт меню навигации (вверху горизонтальной):Загрузите Div из меню нажмите

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
<script type="text/javascript"> 
 
$(document).ready(function() { 
 
\t $("#pia").click(function(){ 
 
     $("#main").load("pia.htm"); 
 
    }); \t 
 
}); 
 
</script>

<body itemscope itemtype="http://schema.org/SomeProducts"> 
 
\t <div class="myContainer"> 
 
\t \t <div class="menuIframe"> 
 
       <nav> 
 
        <ul> 
 
         <li><a href="#"><b>Products</b> <img src="down_arrow.jpg"/></a> 
 
         <ul> 
 
          <li><a id="pia" href="#">Panel Instruments & Accessories</a></li> \t \t \t \t \t \t \t \t \t \t  
 
          <li><a id="stc" href="#">Sequence Timers & Controllers</a></li> 
 
         </ul> 
 
         </li> 
 
        </ul> 
 
       </nav> 
 
      </div> 
 
\t  <div id ="main" class="mainIframe"> 
 
\t \t  <img src="13.jpg"/> 
 
\t  </div> 
 
    </div> 
 
</body>

Однако, загрузка страницы не работает, когда я нажимаю на элемент меню. Интересно, что я делаю неправильно? Спасибо за любую помощь!

источник

2014-12-09 Somyo Banerjee

консоль Придает ли какие-либо ошибки? является pia.htm в том же каталоге? И как ответ ниже, вы хотите предотвратить по умолчанию, поэтому ссылка не выполняется. – Billy

В вашем коде есть междоменная ошибка. Проверьте консоль и убедитесь, что .. –

Добавить preventDefault:

$("#pia").click(function(event) { 
    event.preventDefault(); 
    $("#main").load("pia.htm"); 
});

Это остановит нормальное поведение гиперссылки.

источник

2014-12-09 10:17:09 Mivaweb

есть 2 способа:

замыкающих 'HREF атрибута' javascript:;. <a href="javascript:;">.
использование event.preventDefault(); на функции мыши

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
<script type="text/javascript"> 
 
$(document).ready(function() { 
 
\t $("#pia").on('click', function(e){ 
 
      $("#main").load("pia.htm"); 
 
     }); \t 
 
}); 
 
</script>

<body itemscope itemtype="http://schema.org/SomeProducts"> 
 
\t <div class="myContainer"> 
 
\t \t <div class="menuIframe"> 
 
       <nav> 
 
        <ul> 
 
         <li><a href="javascript:;"><b>Products</b> <img src="down_arrow.jpg"/></a> 
 
         <ul> 
 
          <!-- make href attribute value javascript:; --> 
 
          <li><a id="pia" href="javascript:;">Panel Instruments & Accessories</a></li> \t \t \t \t \t \t \t \t \t \t  
 
          <li><a id="stc" href="javascript:;">Sequence Timers & Controllers</a></li> 
 
         </ul> 
 
         </li> 
 
        </ul> 
 
       </nav> 
 
      </div> 
 
\t  <div id ="main" class="mainIframe"> 
 
\t \t  <img src="13.jpg"/> 
 
\t  </div> 
 
    </div> 
 
</body>

источник

2014-12-09 14:09:17

Загрузите Div из меню нажмите

ответ

Смежные вопросы