Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Document</title>
- <link rel="stylesheet" href="https://bootswatch.com/3/flatly/bootstrap.css">
- <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
- <script>
- $(document).ready(function () {
- $(".btn").click(e => {
- let value = $(".form-control").val();
- $(".nav-tabs").append('<li class="active"><a href=#myid1">1</a>');
- $("#myTabContent").append(`<div class="tab-pane fade active in" id="myid1"><p>Text 1</p>`);
- for (let index = 1;index < value;index++) {
- $(".nav-tabs").append(`<li class=""><a href="#myid1" data-toggle="tab">${index + 1}</a>`);
- $("#myTabContent").append(`<div class="tab-pane fade" id=myid${index+1}><p>Text ${index+1}</p>`);
- }
- let a=document.getElementsByTagName("a");
- for(let item of a){
- item.addEventListener('click',e=>{
- })
- }
- })
- })
- </script>
- </head>
- <body>
- <div class="container">
- <div class="row">
- <input type="text" class="form-control">
- <input type="submit" class="btn btn-default">
- </div>
- <div class="row">
- <ul class="nav nav-tabs">
- <!-- <li class="active"><a href="#myid1" data-toggle="tab" aria-expanded="true">1</a></li>
- <li class=""><a href="#myid1" data-toggle="tab" aria-expanded="false">2</a></li>
- <li class=""><a href="#myid1" data-toggle="tab" aria-expanded="false">3</a></li> -->
- </ul>
- <div id="myTabContent" class="tab-content">
- <!-- <div class="tab-pane fade active in" id="myid1">
- <p>1 текст текст</p>
- </div>
- <div class="tab-pane fade" id="myid2">
- <p>2 текст текст текст текст </p>
- </div>
- <div class="tab-pane fade" id="myid3">
- <p>3 текст текст текст текст текст текст текст текст</p>
- </div> -->
- </div>
- </div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement