Impossible de trouver l'élément à l'intérieur de Datalist par ID avec JQuery

Question

Ci-dessous est un rendu Datalist. Il semble que $ ('# ctl00_ContentPlaceHolder1_ShowListing_DataList1 $ 3 $ 0 $ inquire'). Click (function() {...} ne fonctionne pas car lorsque je clique sur l'un des boutons (sur la DataList) qui sont censés déclencher cette fonction, rien ne se passe.

Comment puis-je utiliser JQuery pour trouver les boutons par ID? donc, fondamentalement, la fonction doit être déclenchée si l'un de ces boutons sur DataList cliquez dessus.

Merci.

<table id="ctl00_ContentPlaceHolder1_ShowListing_DataList1" class="DataWebControlStyle" 
     style="visibility: visible;"> 
     <tbody> 
      <tr> 
       <td class="RowStyle"> 
        <div class="ListItemContainer"> 
         <div class="EnquireButton"> 
          <a class="activator" id="ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$1$enquire"> 
          </a> 
         </div> 
        </div> 
       </td> 
      </tr> 
      <tr> 
       <td class="RowStyle"> 
        <div class="ListItemContainer"> 
         <div class="EnquireButton"> 
          <a class="activator" id="ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$1$enquire"> 
          </a> 
         </div> 
        </div> 
       </td> 
      </tr> 
     </tbody> 
    </table> 

    <script type="text/javascript"> 
     $(function() { 
      $('#ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$0$enquire').click(function() { 
       $('#enquireOverlay').fadeIn('fast', function() { 
        $('#box').animate({ 'top': '160px' }, 500); 
       }); 
      }); 
      $('#boxclose').click(function() { 
       $('#box').animate({ 'top': '-200px' }, 500, function() { 
        $('#enquireOverlay').fadeOut('fast'); 
       }); 
      }); 
     }); 
    </script> 

Answer 1

vous devriez utiliser en direct.

$("#boxclose").live("click", function() { 
        $('#box').animate({ 'top': '-200px' }, 500, function() { 
         $('#enquireOverlay').fadeOut('fast'); 
        }); 
       }); 

Answer 2

Juste n'utilisez pas un ID, utilisez ce pratique class ils ont déjà:

$('a.activator').click(function() { 
    $('#enquireOverlay').fadeIn('fast', function() { 
     $('#box').animate({ 'top': '160px' }, 500); 
    }); 
}); 

Ou encore mieux avec .delegate():

$(".DataWebControlStyle").delegate(".activator", "click", function() { 
    $('#enquireOverlay').fadeIn('fast', function() { 
     $('#box').animate({ 'top': '160px' }, 500); 
    }); 
}); 

Chacune de ces approches à la fois vers le bas Slime votre code et vous permettent de le déplacer vers un fichier externe, cache-mesure pour l'utilisateur.