Ich muss ein paar Schaltflächen dazu bringen, verschiedene Menüs zu öffnen, aber ich kann meine JQuery nicht dazu bringen, es nur einmal aufzurufen. Dies ist eine fast exakte Kopie des Beispielcodes in w3, aber aus irgendeinem Grund werden beide nacheinander angezeigt, wenn ich auf eine der Schaltflächen klicke.

HTML:

<p id="Chombas"> Chombas </p>
<p id="Buzos"> Buzos </p>

<script src="jquery-3.3.1.js">
</script>
<script src="calc2.js"></script>

JS:

$(document).ready("#Chombas").click(function() {
      alert('CHOMBAS');
});
$(document).ready("#Buzos").click(function() {
      alert('BUZOS');
});

Bitte helfen Sie!

2
js_student-92 18 Apr. 2018 im 04:29

3 Antworten

Beste Antwort

$(document).ready akzeptiert eine -Funktion als Parameter und keinen zu verkettenden Selektor. Wickeln Sie Ihr Skript nur in ein einziges $(document).ready ein und hängen Sie die Listener entsprechend an:

$(document).ready(() => {
  $("#Chombas").click(function() {
    alert('CHOMBAS');
  });
  $("#Buzos").click(function() {
    alert('BUZOS');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="Chombas"> Chombas </p>
<p id="Buzos"> Buzos </p>
2
CertainPerformance 18 Apr. 2018 im 01:32
$(document).ready(function () { 
    $('#foo').click(function(e) {
        alert('foo');
    });

    $('#bar').click(function(e) {
        alert('bar');
    });
})

Versuchen Sie, dies zu ersetzen.

2
Farrukh Ayyaz 18 Apr. 2018 im 01:37
$('#button-nav').on('click','p', function (evt) {
    alert($(this).text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="button-nav">
    <p id="Chombas"> Chombas </p>
    <p id="Buzos"> Buzos </p>
</div>

Sie können dies versuchen, um zu vermeiden, dass doppelter Code geschrieben wird

1
ThanhLD 18 Apr. 2018 im 01:54