Advertisement
Guest User

HTML

a guest
Jul 18th, 2018
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.22 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.     <title>Markoversigt</title>
  6.  
  7.     <style>
  8.         #input {
  9.             background-position: 10px 10px;
  10.             background-repeat: no-repeat;
  11.             width: 46%;
  12.             font-size: 16px;
  13.             padding: 12px 20px 12px 40px;
  14.             border: 1px solid #ddd;
  15.             margin-bottom: 12px;
  16.         }
  17.  
  18.         #oversigt {
  19.             border-collapse: collapse;
  20.             width: 100%;
  21.             border: 1px solid #ddd;
  22.             font-size: 18px;
  23.         }
  24.  
  25.         #oversigt th,
  26.         #oversigt td {
  27.             text-align: left;
  28.             padding: 12px;
  29.         }
  30.  
  31.         #oversigt tr {
  32.             border-bottom: 1px solid #ddd;
  33.         }
  34.     </style>
  35.  
  36.     <script src='//code.jquery.com/jquery-2.1.0.js'></script>
  37.     <script>
  38.         $(window).load(function () {
  39.  
  40.             // liste over markerne
  41.             var itemsArray = [];
  42.             itemsArray[0] = ["1-0", "12,44", "https://goo.gl/maps/bJEXBm8xSNJ2"];
  43.             itemsArray[1] = ["1-1", "3,96", "https://goo.gl/maps/pXkXCdYw6Pv"];
  44.             itemsArray[2] = ["3-0", "6", "https://goo.gl/maps/ooNtmudm9qH2"];
  45.             itemsArray[3] = ["4-0", "6,75", "https://goo.gl/maps/jHZmsjhVKZ42"];
  46.             itemsArray[4] = ["5-0", "6,87", "https://goo.gl/maps/bWmq4tcrHPQ2"];
  47.             itemsArray[5] = ["6-0", "5,99", "https://goo.gl/maps/URDarqZWWgz"];
  48.             itemsArray[6] = ["8-0", "4,13", "https://goo.gl/maps/GCbeP9T4tzF2"];
  49.             itemsArray[7] = ["9-0", "1,75", "https://goo.gl/maps/tHqT8pXR8XT2"];
  50.             itemsArray[8] = ["10-1", "4,64", "https://goo.gl/maps/ENqa9QKMCxD2"];
  51.             itemsArray[9] = ["10-2", "4,19", "https://goo.gl/maps/fyKCuS1pFyJ2"];
  52.             itemsArray[10] = ["11-1", "3,6", "https://goo.gl/maps/gXLw1WR2D4r"];
  53.             itemsArray[11] = ["11-2", "3", "https://goo.gl/maps/xhpYKRRpj4M2"];
  54.             itemsArray[12] = ["12-0", "3,53", "https://goo.gl/maps/p2d3Wv2VMh32"];
  55.             itemsArray[13] = ["12-1", "5,34", "https://goo.gl/maps/M7rp7GyURty"];
  56.             itemsArray[14] = ["14-0", "5,15", "https://goo.gl/maps/bPjtQvXUTTN2"];
  57.             itemsArray[15] = ["15-0", "6,56", "https://goo.gl/maps/8aPFRSScZKL2"];
  58.             itemsArray[16] = ["16-0", "4,53", "https://goo.gl/maps/PkgMEQJi8CD2"];
  59.             itemsArray[17] = ["17-0", "5,14", "https://goo.gl/maps/uXuXqotVAcE2"];
  60.             itemsArray[18] = ["18-0", "16,31", "https://goo.gl/maps/H7v4nkYjRok"];
  61.             itemsArray[19] = ["36-0", "8,15", "https://goo.gl/maps/ZgBtdtru1Y42"];
  62.             itemsArray[20] = ["37-0", "7,89", "https://goo.gl/maps/nSywDtp1jiu"];
  63.             itemsArray[21] = ["20-1", "5,2", "https://goo.gl/maps/HZYZktpLPa22"];
  64.             itemsArray[22] = ["21-0", "11,44", "https://goo.gl/maps/NMwmuqANtXk"];
  65.             itemsArray[23] = ["22-1", "5,9", "https://goo.gl/maps/ucQWAE76NHN2"];
  66.             itemsArray[24] = ["23-0", "4,43", "https://goo.gl/maps/8gECaruAMhJ2"];
  67.             itemsArray[25] = ["24-0", "19,85", "https://goo.gl/maps/wzouAWZ26Lm"];
  68.             itemsArray[26] = ["25-0", "18,6", "https://goo.gl/maps/j2PhsFPqdt32"];
  69.             itemsArray[27] = ["51-0", "8,54", "https://goo.gl/maps/uo6ypBH68qF2"];
  70.             itemsArray[28] = ["45-0", "19,92", "https://goo.gl/maps/KW4vBgMNUfq"];
  71.             itemsArray[29] = ["43-1", "8,16", "https://goo.gl/maps/VbvFfSY3eGo"];
  72.             itemsArray[30] = ["53-0", "8,15", "https://goo.gl/maps/56Ldf7S5BqP2"];
  73.             itemsArray[31] = ["34-0", "2,95", "https://goo.gl/maps/uUSfy9h6o812"];
  74.             itemsArray[32] = ["33-0", "8,77", "https://goo.gl/maps/Z8ZW4TDLbt92"];
  75.             itemsArray[33] = ["48-1", "7,09", "https://goo.gl/maps/PHyHS8UcC822"];
  76.             itemsArray[34] = ["48-2", "4,88", "https://goo.gl/maps/JKQK3FrYa6A2"];
  77.             itemsArray[35] = ["50-1", "2,6", "https://goo.gl/maps/onV8uANtwfv"];
  78.             itemsArray[36] = ["50-0", "8,1", "https://goo.gl/maps/Unewt6w6b5o"];
  79.             itemsArray[37] = ["56-2", "6,17", "https://goo.gl/maps/mMJCYLBAd972"];
  80.             itemsArray[38] = ["56-3", "2,13", "https://goo.gl/maps/sMWRudFJg8H2"];
  81.             itemsArray[39] = ["32-0", "8,99", "https://goo.gl/maps/jgp5oWfWNC72"];
  82.             itemsArray[40] = ["32-1", "2,07", "https://goo.gl/maps/wqLEHcs4iV12"];
  83.             itemsArray[41] = ["48-1", "7,09", "https://goo.gl/maps/1rEGjkGMzyy"];
  84.             itemsArray[42] = ["41-0", "11,56", "https://goo.gl/maps/RxtxJXWMKsr"];
  85.             itemsArray[43] = ["68-1", "1,42", "https://goo.gl/maps/ixv5akBAzPR2"];
  86.             itemsArray[44] = ["68-0", "5,28", "https://goo.gl/maps/RVbiyMTNR1J2"];
  87.             itemsArray[45] = ["69-0", "3,59", "https://goo.gl/maps/kE9qTmrQ8Rv"];
  88.             itemsArray[46] = ["67-0", "2,69", "https://goo.gl/maps/iQNJreXrdW82"];
  89.             itemsArray[47] = ["68-2", "2,34", "https://goo.gl/maps/UAqxArdbtgS2"];
  90.             itemsArray[48] = ["66-0", "7,08", "https://goo.gl/maps/i43QAXxYpzA2"];
  91.             itemsArray[49] = ["64-0", "10,58", "https://goo.gl/maps/vaATQNmQxNt"];
  92.             itemsArray[50] = ["65-0", "12,3", "https://goo.gl/maps/8xWnzjnaiiG2"];
  93.             itemsArray[51] = ["70-0", "11,59", "https://goo.gl/maps/WBKr8nLTojB2"];
  94.             itemsArray[52] = ["71-0", "8,73", "https://goo.gl/maps/MbKzznw9AoE2"];
  95.             itemsArray[53] = ["61-0", "5,34", "https://goo.gl/maps/gWAJuaBEWLp"];
  96.             itemsArray[54] = ["61-1", "4,16", "https://goo.gl/maps/mQx2ETmhL3M2"];
  97.             itemsArray[55] = ["72-0", "8,34", "https://goo.gl/maps/16e6Tovw7VJ2"];
  98.  
  99.             var table = $('#oversigt');
  100.             var row, cell;
  101.  
  102.             for (var i = 0; i < itemsArray.length; i++) {
  103.                row = $('<tr />');
  104.                 table.append(row);
  105.  
  106.                 for (var j = 0; j < itemsArray[i].length; j++) {
  107.  
  108.                    var linkText = 'Google maps';
  109.                    var text = itemsArray[i][j];
  110.  
  111.                    if (text.startsWith('https://'))
  112.                        row.append($('<td/>').html("<a href='" + text + "'>" + linkText + "</a>"));
  113.                     else {
  114.                         cell = $('<td>' + itemsArray[i][j] + '</td>')
  115.                         row.append(cell);
  116.                     }
  117.                 }
  118.             }
  119.         });
  120.     </script>
  121. </head>
  122.  
  123. <body>
  124.     <h1>Markoversigt</h1>
  125.     <input type="text" id="input" onkeyup="searchFunction()" placeholder="Søg.." title="søgning">
  126.     <table style="width:50%" id="oversigt" align="center">
  127.         <tr>
  128.             <th>Mark nummer</th>
  129.             <th>Hektar</th>
  130.             <th>Link</th>
  131.         </tr>
  132.     </table>
  133.  
  134. </body>
  135.  
  136. <script>
  137.     function searchFunction() {
  138.         var input, filter, table, tr, td, i;
  139.         input = document.getElementById("input");
  140.         filter = input.value.toUpperCase();
  141.         table = document.getElementById("oversigt");
  142.         tr = table.getElementsByTagName("tr");
  143.         for (i = 0; i < tr.length; i++) {
  144.            td = tr[i].getElementsByTagName("td")[0];
  145.            if (td) {
  146.                if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
  147.                     tr[i].style.display = "";
  148.                 } else {
  149.                     tr[i].style.display = "none";
  150.                 }
  151.             }
  152.         }
  153.     }
  154. </script>
  155.  
  156. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement