HTML contenteditable – Düzenlenebilir İçerik

Html’de bir etiketin değerini düzenlenebilir yapmak için contenteditable kullanılıyor.
Örnek vermek gerekirse;

<div id="test" contenteditable="true">buraya tıkla ve beni düzenle!</div>

Ya da diğer nesneler içinde kullanmak isterseniz contenteditable="true" demeniz yeterli.

jQuery’de Değişikliği Yakalamak

Düzenlenebilir içerik değiştirildiğinde bunu input eventı ile yakalayabiliyoruz.

$('#test').on('input', function(e){
   alert( $(this).text() );
});

kolay gelsin.

Yayınlayan

Tayfun Erbilen

2009'dan beri web işleriyle uğraşan, aynı zamanda amatör müziklede ilgilenen sıradan birisi..

“HTML contenteditable – Düzenlenebilir İçerik” üzerine 6 yorum

  1. Merhaba tayfun,

    peki bu değişikliği jquery yardımı hariç (örn: php ile) post etmemiz mümkünmü

    teşekkürler

    1. jQuery ile değişikliği yakalayıp bir textarea içerisine yazdırırsınız. Post ettiğinizde php kısmında o textarea’nın değerini alıp işlem yapabilirsiniz.

  2. contenteditable’ı bilmiyordum. Teşekkürler 🙂 Her tarayıcı destekliyor mu onu da bilmiyorum şimdilik ama denedim, chrome’da çalıştı.

    Ama jquery komutunu çalıştıramadım nedense… içeriği değiştiriyorum ama alert çalışmıyor :/ neden olabilir ki acaba?

  3. contenteditable gerçektende harika birşeymiş. Bunun kullanışlı ve faydalı şeyleri paylaşırsan minnettar kalırız Tayfun 🙂

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir