HTML Inhalte in Tabelle nach festem oder zufälligem Tag eines Monats einblenden
Hallo liebes Forum!
Ich hoffe als neuer Benutzer gleich alles richtig zu machen. Wenn nicht, bin ich jederzeit für konstruktive Vorschläge dankbar.
Ich möchte an dieser Stelle noch erwähnen, das mir mit Hinweisen nicht geholfen ist, da ich kaum Programmierkenntnisse habe, diese Aufgabe aber beruflich lösen muss.
Ich habe eine durchsuchbare Tabelle mit ca. 300 Werten bzw. kurzen, verlinkten Texten.
Diese Texte würde ich gerne nach einem zufälligem oder festem Schema sichtbar machen.
Dies ist eine stark verkürzte Version meiner Tabelle:
Ich habe zur Veranschaulichung drei Werte übrig gelassen, die an drei verschiedenen Tagen des jeweiligen aktuellen Monats sichtbar sein sollen.
Also der erste Wert immer am ersten eines Monats, der zweite am zweite, der dritte am dritten, usw.
Die Verlinkung auf administrator.de dient nur der Veranschaulichung.
Wenn ich meine ca. 300 Werte dann durch max. 31 Tage eines Monats teile, wären dort immer ca. 10 Werte sichtbar, abhängig vom jeweiligen Tag.
Ich wäre euch für ein komplettes Script dankbar.
Liebe Grüsse
Markus
Ich hoffe als neuer Benutzer gleich alles richtig zu machen. Wenn nicht, bin ich jederzeit für konstruktive Vorschläge dankbar.
Ich möchte an dieser Stelle noch erwähnen, das mir mit Hinweisen nicht geholfen ist, da ich kaum Programmierkenntnisse habe, diese Aufgabe aber beruflich lösen muss.
Ich habe eine durchsuchbare Tabelle mit ca. 300 Werten bzw. kurzen, verlinkten Texten.
Diese Texte würde ich gerne nach einem zufälligem oder festem Schema sichtbar machen.
Dies ist eine stark verkürzte Version meiner Tabelle:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-theme-deep-orange.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<script type="text/javascript">
function addDays(days){
var d = new Date();
d.setDate(d.getDate()+days);
return d;
}
function setDates(){
document.getElementById('date').innerHTML = addDays(0).toLocaleDateString();
}
</script>
<body onload="setDates()">
<style>
* {
box-sizing: border-box;
}
#myInput {
background-image: url('/css/searchicon.png');
background-position: 10px 12px;
background-repeat: no-repeat;
width: 100%;
font-size: 14px;
padding: 12px 20px 12px 40px;
border: 1px solid #ddd;
margin-bottom: 0;
}
#myUL {
list-style-type: none;
padding: 0;
margin: 0;
}
#myUL li a {
border: 1px solid #ddd;
margin-top: -1px; /* Prevent double borders */
background-color: #ff5722;
padding: 12px;
text-decoration: none;
font-size: 16px;
color: white;
display: block
}
#myUL li a:hover:not(.header) {
background-color: #ff5722;
}
</style>
<body>
<!-- Header -->
<header class="w3-container w3-padding-32 w3-center w3-theme">
<button class="w3-btn w3-large w3-theme-dark w3-round-xxlarge"style="font-weight:900;">Last Update: <a id="date"></a></button>
</div>
</div>
</header>
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Sec... finds Secretary, Rec finds Receptionist and so on "title="Search">
<ul id="myUL">
<li><a href="" target="_blank"><b>Administrative Coordinator - Southampton</b></a></li>
<li><a href="" target="_blank"><b>Operations Manager - Brighton-and-Hove</b></a></li>
<li><a href="" target="_blank"><b>Executive Assistant - Kettering</b></a></li>
</ul>
</body>
<script>
function myFunction() {
var input, filter, ul, li, a, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
ul = document.getElementById("myUL");
li = ul.getElementsByTagName("li");
for (i = 0; i < li.length; i++) {
a = li[i].getElementsByTagName("a");
if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
li[i].style.display = "";
} else {
li[i].style.display = "none";
}
}
}
</script>
<!-- Footer -->
<footer class="w3-container w3-theme">
<div class="w3-container w3-padding-16 w3-theme">
<a>Copyright:</a> <a id="year"></a> / <a id="year2"></a>
</div>
<script>
var d = new Date();
document.getElementById("year").innerHTML = d.getFullYear()- 8;
document.getElementById("year2").innerHTML = d.getFullYear();
</script>
<div class="w3-container w3-theme w3-padding-64">
<div class="w3-container w3-theme w3-padding-64">
<div class="w3-container w3-theme w3-padding-64">
<div class="w3-container w3-theme w3-padding-64">
</div>
</body>
</html>
Ich habe zur Veranschaulichung drei Werte übrig gelassen, die an drei verschiedenen Tagen des jeweiligen aktuellen Monats sichtbar sein sollen.
Also der erste Wert immer am ersten eines Monats, der zweite am zweite, der dritte am dritten, usw.
Die Verlinkung auf administrator.de dient nur der Veranschaulichung.
Wenn ich meine ca. 300 Werte dann durch max. 31 Tage eines Monats teile, wären dort immer ca. 10 Werte sichtbar, abhängig vom jeweiligen Tag.
Ich wäre euch für ein komplettes Script dankbar.
Liebe Grüsse
Markus
Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 492399
Url: https://administrator.de/forum/html-inhalte-in-tabelle-nach-festem-oder-zufaelligem-tag-eines-monats-einblenden-492399.html
Ausgedruckt am: 15.03.2025 um 10:03 Uhr
6 Kommentare
Neuester Kommentar
Moin,
Dann wäre das der Zeitpunkt, es zu lernen oder sich einen neues Betätigungsfeld zu suchen.
Dann suche Dir einen, der das kann, und bezahle ihn oder sie dafür. Der oder die wird Dir dann hoffentlich auch sagen, dass man dieses Problem serverseitig und nicht clientseitig lösen sollte. Oder ist das mal wieder eine dieser "praxisnahen" Hausaufgaben?
Liebe Grüße
Erik
Zitat von @randomtime:
Ich möchte an dieser Stelle noch erwähnen, das mir mit Hinweisen nicht geholfen ist, da ich kaum Programmierkenntnisse habe, diese Aufgabe aber beruflich lösen muss.
Ich möchte an dieser Stelle noch erwähnen, das mir mit Hinweisen nicht geholfen ist, da ich kaum Programmierkenntnisse habe, diese Aufgabe aber beruflich lösen muss.
Dann wäre das der Zeitpunkt, es zu lernen oder sich einen neues Betätigungsfeld zu suchen.
Ich wäre euch für ein komplettes Script dankbar.
Dann suche Dir einen, der das kann, und bezahle ihn oder sie dafür. Der oder die wird Dir dann hoffentlich auch sagen, dass man dieses Problem serverseitig und nicht clientseitig lösen sollte. Oder ist das mal wieder eine dieser "praxisnahen" Hausaufgaben?
Liebe Grüße
Erik

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
</head>
<script type="text/javascript">
function ShowEntries(){
var items = document.getElementById('myUL').getElementsByTagName('li');
var today = new Date();
var numDays = new Date(today.getFullYear(), today.getMonth()+1, 0).getDate();
var itemsPerDay = Math.floor(items.length / numDays);
var start = Math.floor((today.getDate() / numDays) * items.length)-itemsPerDay;
for (i = start;i < (start + itemsPerDay);i++){
items[i].className = "visible";
}
}
</script>
<style>
.hidden {display:none;}
.visible {display:block;}
</style>
<body onload="ShowEntries()">
<ul id="myUL">
<li class="hidden"><a href="#"><b>Link1</b></a></li>
<li class="hidden"><a href="#"><b>Link2</b></a></li>
<li class="hidden"><a href="#"><b>Link3</b></a></li>
<li class="hidden"><a href="#"><b>Link4</b></a></li>
<li class="hidden"><a href="#"><b>Link5</b></a></li>
<li class="hidden"><a href="#"><b>Link6</b></a></li>
<li class="hidden"><a href="#"><b>Link7</b></a></li>
<li class="hidden"><a href="#"><b>Link8</b></a></li>
<li class="hidden"><a href="#"><b>Link9</b></a></li>
<li class="hidden"><a href="#"><b>Link10</b></a></li>
<li class="hidden"><a href="#"><b>Link11</b></a></li>
<li class="hidden"><a href="#"><b>Link12</b></a></li>
<li class="hidden"><a href="#"><b>Link13</b></a></li>
<li class="hidden"><a href="#"><b>Link14</b></a></li>
<li class="hidden"><a href="#"><b>Link15</b></a></li>
<li class="hidden"><a href="#"><b>Link16</b></a></li>
<li class="hidden"><a href="#"><b>Link17</b></a></li>
<li class="hidden"><a href="#"><b>Link18</b></a></li>
<li class="hidden"><a href="#"><b>Link19</b></a></li>
<li class="hidden"><a href="#"><b>Link20</b></a></li>
<li class="hidden"><a href="#"><b>Link21</b></a></li>
<li class="hidden"><a href="#"><b>Link22</b></a></li>
<li class="hidden"><a href="#"><b>Link23</b></a></li>
<li class="hidden"><a href="#"><b>Link24</b></a></li>
<li class="hidden"><a href="#"><b>Link25</b></a></li>
<li class="hidden"><a href="#"><b>Link26</b></a></li>
<li class="hidden"><a href="#"><b>Link27</b></a></li>
<li class="hidden"><a href="#"><b>Link28</b></a></li>
<li class="hidden"><a href="#"><b>Link29</b></a></li>
<li class="hidden"><a href="#"><b>Link30</b></a></li>
<li class="hidden"><a href="#"><b>Link31</b></a></li>
<li class="hidden"><a href="#"><b>Link32</b></a></li>
<li class="hidden"><a href="#"><b>Link33</b></a></li>
<li class="hidden"><a href="#"><b>Link34</b></a></li>
<li class="hidden"><a href="#"><b>Link35</b></a></li>
<li class="hidden"><a href="#"><b>Link36</b></a></li>
<li class="hidden"><a href="#"><b>Link37</b></a></li>
<li class="hidden"><a href="#"><b>Link38</b></a></li>
<li class="hidden"><a href="#"><b>Link39</b></a></li>
<li class="hidden"><a href="#"><b>Link40</b></a></li>
<li class="hidden"><a href="#"><b>Link41</b></a></li>
<li class="hidden"><a href="#"><b>Link42</b></a></li>
<li class="hidden"><a href="#"><b>Link43</b></a></li>
<li class="hidden"><a href="#"><b>Link44</b></a></li>
<li class="hidden"><a href="#"><b>Link45</b></a></li>
<li class="hidden"><a href="#"><b>Link46</b></a></li>
<li class="hidden"><a href="#"><b>Link47</b></a></li>
<li class="hidden"><a href="#"><b>Link48</b></a></li>
<li class="hidden"><a href="#"><b>Link49</b></a></li>
<li class="hidden"><a href="#"><b>Link50</b></a></li>
<li class="hidden"><a href="#"><b>Link51</b></a></li>
<li class="hidden"><a href="#"><b>Link52</b></a></li>
<li class="hidden"><a href="#"><b>Link53</b></a></li>
<li class="hidden"><a href="#"><b>Link54</b></a></li>
<li class="hidden"><a href="#"><b>Link55</b></a></li>
<li class="hidden"><a href="#"><b>Link56</b></a></li>
<li class="hidden"><a href="#"><b>Link57</b></a></li>
<li class="hidden"><a href="#"><b>Link58</b></a></li>
<li class="hidden"><a href="#"><b>Link59</b></a></li>
<li class="hidden"><a href="#"><b>Link60</b></a></li>
</ul>
</body>
</html>

Klar, aber dat is jetzt dein Problem, also setz dich hin und lerne. Wenn das beruflich deine Aufgabe ist solltest du nicht Arbeiten annehmen denen du nicht gewachsen bist, und dann auch noch dreist hingehen und sie von Foren erledigen lassen um dann falsche Tatsachen beim Arbeitgeber vorzutäuschen.

Schuster bleib bei deinen Leisten.
Viel Spaß noch... nichts zu Danken. Kopfschüttel.
Zweitens: Hatte der sonst zuständige Kollege einen schweren Sportunfall und liegt im Krankenhaus.
Das tut mir leid, Sport ist eben auch manchmal Mord.Drittens: Kam mein Chef auf die Idee das ich mich dieser Sache annehmen sollte. Da kann man schlecht nein sagen oder?
Öhm doch, ehrlich sein währt immer noch am längsten, oder lass dir eine Schulung als Programmierer bezahlen. Hier einfach irgendwelchen zusammenkopieren Code ohne weitere Erläuterung zu Posten ist ehrlich gesagt dreist.Viel Spaß noch... nichts zu Danken. Kopfschüttel.