<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Strait"> <div class="container" style="font-family: 'Strait', sans-serif;"> <h1 class="text-center">Input Olayı (Paste & Autofill) Test Uygulaması</h1> <p class="lead text-center">Aşağıdaki alanlara kopyala/yapıştır yaparak ya da otomatik doldurma ile değer girdiğinizde, <strong>anında</strong> tespit edilecektir.</p> <div class="row"> <div class="col-sm-6"> <div class="form-group"> <label for="InputA">Test Alanı A</label> <!-- Bu alan için 'input' olayı test ediliyor --> <input id="InputA" name="InputA" type='text' class="form-control input-lg" placeholder='Metni buraya yapıştırın veya sürükleyin...' /> </div> </div> <div class="col-sm-6"> <div class="form-group"> <label for="InputB">Test Alanı B</label> <!-- Bu alan da aynı olayı dinliyor --> <input id="InputB" name="InputB" type='text' class="form-control input-lg" placeholder='Buraya da yapıştırabilirsiniz...' /> </div> </div> </div> <div class="panel panel-info"> <div class="panel-heading">Tespit Edilen Değişiklikler</div> <div class="panel-body"> <div id="logMessage"> Lütfen bir üstteki input alanına klavye kullanmadan (sağ tık > yapıştır veya Ctrl+V/Cmd+V) metin yapıştırın. </div> </div> </div> </div>

body { padding: 40px; background-color: #e9ecef; } .panel { margin-top: 30px; } .form-control.input-lg { height: 50px; font-size: 18px; }

// Sayfa tamamen yüklendiğinde çalışacak kısım $(document).ready(function() { // 'input' olayı hem 'change' hem de 'keyup' olaylarının kapsamadığı durumları yakalar. // Özellikle: Kopyala-Yapıştır, Kesme (Cut), Sürükle-Bırak ile değer değiştirme ve Otomatik Doldurma. $("#InputA, #InputB").on("input", function(){ const elementId = $(this).attr('id'); const currentValue = $(this).val(); console.log("INPUT Olayı: " + elementId + " alanında anlık değişiklik tespit edildi. Değer: " + currentValue); // Log mesajını güncelleyelim. $("#logMessage").html( `<strong>ANLIK DEĞİŞİKLİK TESPİT EDİLDİ!</strong> <ul> <li>Alan ID: <strong>${elementId}</strong></li> <li>Yeni Değer Uzunluğu: <strong>${currentValue.length}</strong> karakter</li> <li>Olay Kaynağı: (Büyük ihtimalle Kopyala/Yapıştır veya Otomatik Doldurma)</li> </ul>` ); }); });