Po próbach dowiedzieć się na jeden dzień, dlaczego ten prosty kawałek kodu nie działa, muszę zapytać kogoś innego, ponieważ po prostu nie mogę tego zrozumieć.

HTML:

<li><button id="button-middle" type="button"></button>
<ul id="list-middle" style="display: none;"></ul>
</li>

JQuery:

$(document).ready(function () {
    $('#button-middle').click(function () {
        $.post('file.php', {data_1: $('#select_1 option:selected').text(), data_2: $('#select_2 option:selected').text()}, function (data) {
            $('#list-middle').html(data);
        });
    });
});

$(document).ready(function () {
    $('#list-middle li').click(function () {
        alert('test');
    });
});

Przycisk jest częścią UL, który zawiera trzy przycisk, ten jest środkowy. File.php po prostu składa się z prostego echa z włożonym wysłanym danymi. Wyjście jest zgodne z oczekiwaniami (Licznik Li w ul), ale kiedy klikam jeden z tych tagów Li, nic się nie dzieje. Dlaczego?

Aby być superroczystym, oto plik PHP:

if (isset($_POST['data_1']) and isset($_POST['data_2'])) {
        $data_1 = $_POST['data-1'];
        $data_2 = $_POST['data_2'];
        echo '<li data-value="right" id="to_right"><span>&#8594;&nbsp;Von '.$data_1.' nach '.$data_2.'</span></li>
                                <li data-value="left" id="to_left"><span>&#8594;&nbsp;Von '.$data_2.' nach '.$data_1.'</span></li>
    ';
    }

Doceniam jakąkolwiek pomoc, ponieważ po dłuższym dniu, to doprowadza mnie do nakrętek.

0
AlexM 27 luty 2019, 14:23

2 odpowiedzi

Najlepsza odpowiedź

Podczas wiążących działań, takich jak działania kliknij, powinieneś zdefiniować kontekst (dokument w tym przypadku), aby pracować z dynamiczną zawartością zawartości. Myślisz, że powinien pracować:

$(document).on('click','#list-middle li', function(e){ alert('test'); });
2
grupowebex 27 luty 2019, 11:32

Myślę, że problemem jest, że elementy listy są dodawane dynamicznie, więc zdarzenie kliknięcia nie jest dołączane do nich. Ponieważ wystrzelił tylko raz na dokument gotowy.
.. Możesz spróbować tego:

$('body').on('click', '#list-middle li', function() {
    // do something
});

Jeśli przypomnę sobie poprawić, nazywa się bulgoczenie wydarzeniem.

1
Dmitriy 27 luty 2019, 11:34