Открытые страницы jsp внутри вкладок

Я пытаюсь открыть страницу jsp, поскольку вкладка (содержимое вкладки - страницы jsp) была нажата, но вместо этого она переходит на эту страницу в новом окне, а вкладки исчезают.Открытые страницы jsp внутри вкладок

вот мой js для tabs

$(document).ready(function(){ 
    $(".tabbable").find(".tab").hide(); 
     $(".tabbable").find(".tab").first().show(); 
     $(".tabbable").find(".tabs li").first().find("a").addClass("active"); 
     $(".tabbable").find(".tabs").find("a").click(function(){ 
      tab = $(this).attr("href"); 
      $(".tabbable").find(".tab").hide(); 
      $(".tabbable").find(".tabs").find("a").removeClass("active"); 
      $(tab).show(); 
      $(this).addClass("active"); 
      return false; 
     }); 
});

и jsp

<body> 
<div class="tabbable"> 
    <ul class="tabs"> 
     <li><a href="pages/first.jsp">first</a></li> 
     <li><a href="pages/second.jsp">second</a></li> 
     <li><a href="pages/third.jsp">third</a></li> 
    </ul> 
<div id="first" class="tab"> 
    contents of this tab. 
</div> 
</div> 
</body>

Я новичок в JavaScript, Где я ошибаюсь?

Примечание: JSFiddle как несколько советов.

источник

2015-05-06 Sajjad

[This] (http://stackoverflow.com/questions/5904944/how-to-open-a-link-from-within-jquery-ui-tabs-inside-said-tab?lq=1) решил мою проблему с незначительной настройкой. – Sajjad

Согласно вашему сообщению, я предполагаю, что вы используете jQuery. Мой ответ основан на этом предположении, поэтому, если я ошибаюсь, пожалуйста, проигнорируйте это сообщение.

Я также предполагаю, что вы намерены показать содержимое каждой вкладки внутри div с идентификатором «первым».

Прежде всего, я не понимаю, почему код, который вы опубликовали, откроет содержимое вкладки в новом окне, так как возвращение false в обработчик события предотвращает поведение по умолчанию (в анкерных элементах это поведение по умолчанию открывает ссылочная страница), может быть, мне не хватает информации здесь.

Согласно вашему сообщению, вы не получаете содержание ни одной из этих страниц в любом месте. Я добавил несколько дополнительных строк в коде, чтобы сделать это:

$(document).ready(function(){ 
     $(".tabbable").find(".tab").hide(); 
      $(".tabbable").find(".tab").first().show(); 
      $(".tabbable").find(".tabs li").first().find("a").addClass("active"); 
      $(".tabbable").find(".tabs").find("a").click(function(){ 
        tab = $(this).attr("href"); 
        $(".tabbable").find(".tab").hide(); 
        $(".tabbable").find(".tabs").find("a").removeClass("active"); 
        //$(tab).show(); -> This line does nothing, as no element matches the given selector 
        // Get html content making a GET request 
        // see: https://api.jquery.com/jquery.get/ 
        $.get(tab, function(data) { 
         // Add the html content to the container 
         $("#first").html(data); 
        }); 
        $(this).addClass("active"); 
        return false; 
       }); 
     });

В основном то, что пара строк делает это: 1) сделать запрос на сервер, чтобы получить требуемое содержание; 2) Вставьте этот контент в div с id 'first'.

Еще раз, если это не то, что вы намереваетесь сделать, вы можете просто отказаться от этого ответа. Если в моем коде есть что-то не так, или у вас есть какие-либо сомнения относительно моего решения, не стесняйтесь задавать вопрос.

источник

2015-05-06 08:25:31 Ion

Я пробовал, как вы предложили, все тот же результат, я обновляю свой ответ с помощью JsFiddle, пожалуйста, посмотрите. – Sajjad

Как я уже говорил в своем предыдущем ответе, я был уверен, что вы используете библиотеку jQuery (из-за того, что вы используете переменную $), вы не включили эту библиотеку в jsfiddle. Я обновил jsfiddle, чтобы использовать библиотеку jQuery. Из-за ограничений безопасности содержимое этих страниц не загружается. Не могли бы вы повторить попытку с вашим кодом, но на этот раз, в том числе библиотеку jQuery (вы можете получить ее из CDN, например, из CDN от Google - https://developers.google.com/speed/libraries/) – Ion

Я не вижу изменений в jsfiddle , даже если я включаю библиотеку jQuery, содержимое страницы jsp открывается в новом окне, а вкладки исчезают, так как управление смещается на эту страницу jsp. где, как я хочу, чтобы эта страница отображалась на одной вкладке, а вкладки не должны исчезать. – Sajjad

Открытые страницы jsp внутри вкладок

ответ

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