• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

jQuery dauerhafte Checkbox Abfrage

DerNeuling21

Mitglied
Hallo zusammen,

hier mal kurz der Beispielcode zum besseren Verständnis:

HTML:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $('input[type="checkbox"]').click(function(){
            if($(this).prop("checked") == true){
                $('#Ausgabe').show();
            }
            else if($(this).prop("checked") == false){
                $('#Ausgabe').hide();
            }
        });
    });
</script>
</head>
<body>
    
    <p><input type="checkbox">Test</p>
    <p id="Ausgabe">Die Ausgabe</p>
</body>
</html>

Ich möchte für meinen Code eine dauerhafte Abfrage, ob die Checkbox jetzt aktiv ist. Bei diesem Code wird nur show und hide ausgeführt, wenn die Box geklickt wird. Wie kann man das umbauen, das auch ohne klicken gleich am Anfang hide() ausgeführt wird ?

Danke für die Hilfe.
 
Werbung:
Wie meinst du das genau. Du fragst ob man das gleich am Anfang ausgeführt wird ohne klicken.
Dann brauchst du doch nur
Code:
       $('#Ausgabe').hide();
Aus deiner Funktion da raus nehmen und vor der Click setzten,also am anfang des Scriptes. Dann ist aber deine Ausgabe sichtbar ,egal ob checkbox gescheckt wurde oder nicht.

Aberr das meinst du ja bestimmt nicht. Du könntest ja auch die Function automatisch starten beim Seiten aufruf.
Nur was meinst du mit einer dauerhaften Abfrage der Checkbox ? Du könntest da einen Interval draufsetzte , aber beim clicken der Box wird der Status doch automatisch geändert. Du kannst ja click() oder change() und sobald das gemacht wurde kannst du ja auf hide() setzten.

Ich verstehe das gerade alles irgendwie nicht so genau weil click events sind ja dafür da um aufzupassen wann die Checkbox ihren Stautus ändert
 
Wie meinst du das genau. Du fragst ob man das gleich am Anfang ausgeführt wird ohne klicken.
Dann brauchst du doch nur
Code:
       $('#Ausgabe').hide();
Aus deiner Funktion da raus nehmen und vor der Click setzten,also am anfang des Scriptes. Dann ist aber deine Ausgabe sichtbar ,egal ob checkbox gescheckt wurde oder nicht.

Aberr das meinst du ja bestimmt nicht. Du könntest ja auch die Function automatisch starten beim Seiten aufruf.
Nur was meinst du mit einer dauerhaften Abfrage der Checkbox ? Du könntest da einen Interval draufsetzte , aber beim clicken der Box wird der Status doch automatisch geändert. Du kannst ja click() oder change() und sobald das gemacht wurde kannst du ja auf hide() setzten.

Ich verstehe das gerade alles irgendwie nicht so genau weil click events sind ja dafür da um aufzupassen wann die Checkbox ihren Stautus ändert
Lass das Dauerhaft weg, das macht er ja immer. Es geht mir darum, das Script/die Funktion soll gleich beim Seitenaufruf also gleich beim start ausgeführt werden und somit "scharf" sein, das bei jeder Änderung der Checkbox die definierten Aufgaben ausgeführt werden.


Ich bräuchte eigentlich so etwas wie:
Code:
            if($(this).prop("checked") == true){
                $('#Ausgabe').show();
            }
            else if($(this).prop("checked") == false){
                $('#Ausgabe').hide();
            }

Ohne eine Ausführungsbedingung wie "click".

Wie kann man so etwas machen ???
 
Werbung:
Lass das Dauerhaft weg, das macht er ja immer. Es geht mir darum, das Script/die Funktion soll gleich beim Seitenaufruf also gleich beim start ausgeführt werden und somit "scharf" sein, das bei jeder Änderung der Checkbox die definierten Aufgaben ausgeführt werden.


Ich bräuchte eigentlich so etwas wie:
Code:
            if($(this).prop("checked") == true){
                $('#Ausgabe').show();
            }
            else if($(this).prop("checked") == false){
                $('#Ausgabe').hide();
            }

Ohne eine Ausführungsbedingung wie "click".

Wie kann man so etwas machen ???

Einfach das click Event gleich zu Beginn triggern müsste eigentlich funktionieren:

Code:
$('input')
  .click(function () {...})
  .click(); // <---
 
Werbung:
Also mit diesem Code
Code:
        $(document).ready(function(){
            if($('input[type="checkbox"]').prop("checked") == true){
                $('#Ausgabe').show();
            }
            else if($('input[type="checkbox"]').prop("checked") == false){
                $('#Ausgabe').hide();
            }
        });

Wird die "Ausgabe" beim Seitenaufruf schon einmal nicht angezeigt. Kann man das jetzt noch erweitern, das nicht nur .ready sondern auch noch .click dran steht ?

Also Trigger sind dann Seitenstart mit .ready und draufklicken mit .click
Dann hätte ich mein Ziel erreicht.
 
Man könnte es auch so machen ,aber ist wahrscheinlich eine Mist Lösung
Javascript:
   $(document).ready(function(){
   d=$('input[type="checkbox"]');
   go(d);
          d.click(function(){
               go(d);
          });
    });



function go(d){
            if($(d).prop("checked") == true){
                  $('#Ausgabe').show();
                  console.log(true);
            }
            else if($(d).prop("checked") == false){
                  $('#Ausgabe').hide();
                  console.log(false);
            }
}
 
Zuletzt bearbeitet:
Warum nicht gleich so?
Javascript:
   $(document).ready(function(){
       $('#Ausgabe').hide();
       $('input[type="checkbox"]').click(function(){
            if($(this).prop("checked") == true){
                $('#Ausgabe').show();
            }
            else if($(this).prop("checked") == false){
                $('#Ausgabe').hide();
            }
        });
    });
 
Werbung:
So ich hab jetzt mal weiter rum geschaut und bin dann jetzt auf folgende Lösung gekommen, die eigentlich funktionieren müsste:

Javascript:
    function hide_show(checkboxID, targedID) {
        if($('#' + checkboxID).prop("checked") == true){
            $('#' + targedID).show();
        }
        else if($('#' + checkboxID).prop("checked") == false){
            $('#' + targedID).hide();
        }
    }

    $(document)
        .ready(hide_show("checkbox-Person", "Person-Input"))
        .ready(hide_show("checkbox-Company", "Company-Input"))
        .ready(hide_show("checkbox-Customer", "Customer-Number-Input"))
        .ready(hide_show("checkbox-Vendor", "Vendor-Number-Input"))

    $('input[type="checkbox"]')
        .click(hide_show("checkbox-Person", "Person-Input"))
        .click(hide_show("checkbox-Company", "Company-Input"))
        .click(hide_show("checkbox-Customer", "Customer-Number-Input"))
        .click(hide_show("checkbox-Vendor", "Vendor-Number-Input"))

Aber warum geht das nicht ? Hab das mal durch 2 Tester gejagt, beide finden nichts.
 
Ich glaube da wahr Version aus post 8 und 9 besser. So wie du das vorhast habe ich das auch noch nicht gesehen und wird wohl auch nicht klappen. Wie ich das sehe werden ja beim Click alle 4 boxen an function hideshow gesendet und abgefragt. Ich glaube nicht das es so sinn ergibt und klappt . Kann mich auch irren ,und probiere das mal selber aus .
 
Zurück
Oben