• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Skrypt otwierający zewnętrzny dokument html w divie poniżej

Object Storage Arubacloud
0 głosów
420 wizyt
pytanie zadane 18 grudnia 2018 w JavaScript przez Spaghet Nowicjusz (120 p.)

Witam ;)

Chciałbym napisać skrypt, który sprawi, że KAŻDY link do zewnętrznego dokumentu html po kliknięciu otworzy mi dany dokument w divie. Precyzując ma to być plan lekcji, każda z tabeli(których jest mnóstwo) jest osobnym dokumentem html. Na górze strony mam kilka dropdownów z linkami do konkretnych tabel. Poniżej umieszczony jest container-fluid, w którym otwierać ma się tabela. Sam jestem raczej laikiem jeśli chodzi o js'a i jego biblioteki, więc o ile to możliwe prosiłbym o gotowy skrypt ale chętnie przyjmę każdą inną formę pomocy. W każdym razie z góry dziękuję za odpowiedzi. ;)

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>plan</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link rel="stylesheet" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
   
    <h1 class="display-4 text-center">Plan</h1>

    <nav class="navbar navbar-expand-lg navbar-light">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav nav-fill w-100">

                <li class="nav-item dropdown">
                    <a class="nav-link" href="#" role="button" data-toggle="dropdown">
                        Klasy I
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link" href="#" role="button" data-toggle="dropdown">
                        Klasy II
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link" href="#" role="button" data-toggle="dropdown">
                        Klasy III
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link" href="#" role="button" data-toggle="dropdown">
                        Klasy IV
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                        <a class="dropdown-item" href="#zewnętrzny dokument html">klasa</a>
                    </div>
                </li>          
            </ul>
        </div>
    </nav>



    <div class="container-fluid text-center my-5" id="shedule">

    </div>



    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>

 

1 odpowiedź

0 głosów
odpowiedź 18 grudnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)
Skoro bierzesz się za tworzenie stron to musisz zaprzyjaźnić się z JS, nie da rady bez tego :)

A Twój problem może rozwiąże iframe?
komentarz 19 grudnia 2018 przez Spaghet Nowicjusz (120 p.)
Oczywiście, wiem że js jest niezbędny. Potrafie napisac proste skrypty ale z tym sobie nie poradzę, a czas mnie goni. Iframe nie wchodzi w grę, ale dzięki ;)
komentarz 19 grudnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)
to jak ty bierzesz projekt nie umiejac js :)? albo to ja mam spaczone podejscie bo biore tylko te apki, które umiem zrobic :)

 

a wracając do tematu to tak serio, czemu iframe kategorycznie nie?

Podobne pytania

0 głosów
1 odpowiedź 96 wizyt
0 głosów
0 odpowiedzi 285 wizyt
pytanie zadane 24 lutego 2019 w PHP przez Li4M4tt8iL Nowicjusz (120 p.)
0 głosów
1 odpowiedź 692 wizyt
pytanie zadane 30 marca 2016 w HTML i CSS przez R.orlinski Mądrala (5,490 p.)

92,536 zapytań

141,377 odpowiedzi

319,452 komentarzy

61,920 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...