v2.5.2
Giriş yap

Sayfaya sonradan eklenen elemanlara ulaşma

bayburt
720 defa görüntülendi
Not Projemde jquery 3,6 ve boostrap 5 kullanıyorum

indexphp sayfamda klası global olan bir divim var sayfada ilgili butona tıklanınca bu global div içine jquery load metoduyla modal.php yi include edip ardından görünür hale getiriyorum

<div class="global"></div>
$.modalAc=function (mod) {

    $('.global').load('modal.php',function () {
        var myModal = new bootstrap.Modal(document.getElementById('ilAyarla'));
        myModal.show(); 
    });

    }

}  

buraya kadar sıkıntı yok lakin açılan modal içindeki devamet butona tıklanınca işlem yaptıramıyorum sorunum bu

**********  Şu fonk çalıtıramyorum  ************
$('#ilAyarla .btn').on('click',function () {
    alert()
});
<form class="modal fade" id="ilAyarla" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg shadow-lg">
        <div class="modal-content">
            <div class="modal-header border-0">
                <h5 class="modal-title" id="exampleModalLabel">İl ilçe seçiniz</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                    <div class="col-12 col-md-6">
                        <?php require '../../cache/il.php';?>
                        <select class="form-control mt-3 ilce" name="ilce" required><option value="">İlçe</option></select>
                    </div> 
                        <div class="col-12 col-md-6 d-flex align-items-center">
                            <img class="m-auto img-fluid" src="img/global/ok.webp"/>
                        </div>                          
                    </div>                
                </div>                
            </div>
            <div class="modal-footer border-0 justify-content-start">
                <button type="button" class="btn btn-sm btn-outline-info ms-3" onclick="$.ilAyarla()">Devam et</button>
            </div>
        </div>
        <div class="data pe-auto"></div>
    </div>
</form>
tayfunerbilen
1107 gün önce

live click işlemine ihtiyacın var, sonradan eklenen elemanlar için event'larını şu şekilde tanımlarsan sorunun çözülür

$(document.body).on('click', '#ilAyarla .btn', function(e) {
    alert('test');
});