Javascript ile inputa girilen değerler, diziye nasıl eklenir onu paylaşacağım. Jquery’de textbox’a girilen değeri diziye ekleme işlemi butona bastığınızda tamamlanacaktır. Aşağıda canlı demo ve kaynak kodlarıyla birlikte görebilirsiniz.
Canlı Demo
Aşağıdaki kaynak kodlar “Html + CSS + JS “ ile birlikte verilmiştir. Tümünü kopyalayıp “.html” şeklinde kayıt ettiğinizde hemen çalıştırabilirsiniz.
KAYNAK KODLAR İÇİN
<html> <head> <TITLE>Jquery İle İnputa Girilen Verileri Diziye Ekleme</TITLE> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <style> .baslik { font-weight: 600; color: darkred; text-align: center; } .kutu { width: 300px; height: 100px; border: 1px solid darkred; box-sizing: content-box; word-wrap: break-word; } </style> </head> <body> <h2>Dizi'ye Veri Ekle</h2> <input type="text" id="inputAd"> <input type="button" value="DİZİYE EKLE" id="buton1"> <br><br> <div class="kutu"> <div class="baslik">Dizi'deki Değerler</div><br> <label id="diziCanli"></label> </div> <script type="text/javascript"> $(document).ready(function(){ var dizi=[]; $("#buton1").click(function(){ dizi.push($("#inputAd").val()); $("#diziCanli").append($("#inputAd").val()+","); // $("#inputAd").val(""); // Butona basıldığında içeriği temizler }); }); </script> </body> </html>