javascript alışkanlık php html etiketleri ayrıştırmak

3 Cevap php

php <p class="select"></p> etiketleri sarılı ajax html html dizeleri gönderir, css mükemmel sınıfı okur. javascript / jquery değil. javascript / jquery bile alışkanlık ayrıştırmak <p onclick="function()"></p>. Ben yanlış ne yapıyorum?

heres my php (sends data via ajax fine)

echo "<p class='select' onclick='populate();' >{$row['song_name']} </p>";

heres my css (works fine)

p.select{color:#fff;padding: 5px;margin:0}
p.select:hover{color:#fff;background:#f60;cursor:pointer;}

heres my javascript method 1 jquery.

$("p .select").click(function(){
        var str = $(this).val();
        alert(str);
  });

yöntemi 2 onclick fonksiyonu.

function populate()
{

alert('here')
}

her iki yöntem de hiç de yanıt verir. Neden bu guru?

3 Cevap

$("p .select").live ( "click" , function(){
        var str = $(this).text();
        alert(str);
  });

Görmek

Events/live

Binds a handler to an event (like click) for all current - and future - matched element.

İki şey:

  • p .select seçim <p> etiketleri seçin sınıfı ile containing bir unsur. Olacak p.select seçer <p class="select">.
  • Neden canlı içindeki için populate işlevi taşımak değil? Ben jquery canlı (ya tıklayın) şüpheleniyorsanız herhangi bir açık işleyicileri kaldırır.

Bu deneyin:

$("p.select").live("click",function()
{
    var str = $(this).text();
    alert(str);
    populate();
});

Aşağıda örnekte (Firefox içinde) bir çalışma yayınlanmıştır. Ben onload olayı içindeki jquery yöntemi koymak unuttum düşünüyorum. Diğer (küçük) hataların yanında ...

<html>
   <head>
      <style>
         p.select{color:#fff;padding: 5px;margin:0}
         p.select:hover{color:#fff;background:#f60;cursor:pointer;}
      </style>      
      <script src="jquery-1.3.2.min(2).js" type="text/javascript"></script>
      <script type="text/javascript">         
         function bodyOnLoad() {
            //instead of "p .select" "p.select"
            $("p.select").click(
               function(){
                  //changed val() into text()
                  var str = $(this).text();
                  alert(str);
               }); 
         }
      </script>         
   </head>
   <body onload="bodyOnLoad()">
      <p class='select'>Songname</p>
   </body>
</html>