SORU
12 Temmuz 2011, Salı

Tıklatın olay'dinamik olarak oluşturulan öğeleri üzerinde çalışmıyor

<html>
<head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">

        $(document).ready(function() {

            $("button").click(function() {
                $("h2").html("<p class='test'>click me</p>")
            });   

            $(".test").click(function(){
                alert();
            });
        });

    </script>
</head>
<body>
    <h2></h2>
    <button>generate new element</button>
</body>
</html>

Sınıf adı test ile yeni bir etiket oluşturmak için düğmeye tıklatarak <h2> olarak çalışıyordum. Ben de bir click olayı test ile ilişkili tanımlanmış. Ama olay işe yaramıyor.

Herkes yardımcı olabilir?

CEVAP
12 Temmuz 2011, Salı

Kullandığınız bağlama denir click() Bir "doğrudan" tek öğeleri işleyicisi iliştirmek olacak bağlamazaten var. Elemanları, gelecekte oluşturulacak bağlı olmaz. Bunu yapmak için, "" on() kullanarak. bağlama temsilci oluşturmanız gerekir

Temsilci olayları daha sonra belge için eklenen alt öğelerini olayları işleyebilir avantajı var.

Source

Aradığınız şey burada:

var counter = 0;

$("button").click(function() {
    $("h2").append("<p class='test'>click me "   (  counter)   "</p>")
});

// With on():

$("h2").on("click", "p.test", function(){
    alert($(this).text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<h2></h2>
<button>generate new element</button>

Yukarıdaki kullananlar jQuery sürüm 1.7 için çalışıyor . Eğer eski bir sürümünü kullanıyorsanız, bir önceki cevap için aşağıya bakınız.

Önceki Cevap:

live() kullanmayı deneyin:

$("button").click(function(){
    $("h2").html("<p class='test'>click me</p>")
});   


$(".test").live('click', function(){
    alert('you clicked me!');
});

Benim için çalıştı. JsFiddle ile Tried it.

Ya delegate() ile yapıyor yeni dahiyane bir yolu var:

$("h2").delegate("p", "click", function(){
    alert('you clicked me again!');
});

An updated jsFiddle.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:
DV OlaylarJquery

AYNI ETİKETTEKİ VİDEOLAR

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • BgirlNilaya

    BgirlNilaya

    29 EKİM 2008
  • Fr. Eckle Studios

    Fr. Eckle St

    29 Kasım 2006
  • MattSteffanina 2

    MattSteffani

    28 Kasım 2007

İLGİLİ SORU / CEVAPLAR

İLGİLİ BAĞLANTILAR