Если нажать на ярлык показать предупреждение - Jquery

Question

Мой код в HTML:

<td id ="tdtest"> 
    <a id="atest" href="#"> 
     <span id="spantest">Show</span> 
    </a> 
</td> 

и Jquery:

$(document).ready(function() { 

    $("#tdtest #atest").on('click',function(){ 
     alert ("Success !!!"); 

    }) 
} 

Но когда я нажмите "Показать", он не работает.

Answer 1

У вас не может быть отдельного <td> без окружения стола и стола. Как только вы пишете действительный код, он работает:

$("#tdtest #atest").on('click',function(){ 
 
    alert ("Success !!!"); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
<tr> 
 
    <td id="tdtest"> 
 
    <a id="atest" href="#"> 
 
     <span id="spantest">Show</span> 
 
    </a> 
 
    </td> 
 
</tr> 
 
</table>

Как указывается в других ответах уже, идентификатор уже является уникальным идентификатором DOM элемента, так что нет на самом деле нет необходимости использовать два идентификатора в селекторе, и он может даже внутренне замедлить поиск правильного узла.

Answer 2

1. использовать только один идентификатор в селекторе
2. код ставится после документа готового, $(function(){ code here.. })

$(function(){ 
 
    $("#atest").on('click',function(){ 
 
    alert ("Success !!!"); 
 

 
    }) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<td id="tdtest"> 
 
    <a id="atest"> 
 
     <span id="spantest">Show</span> 
 
    </a> 
 
</td>

Answer 3

использования div места td и ваш код работает.

<div id ="tdtest"> 
    <a id="atest" href="#"> 
     <span id="spantest">Show</span> 
    </a> 
</div> 

JS

$(document).ready(function() { 
    $("#tdtest #atest").on('click',function(){ 
     alert ("Success !!!"); 
    }); 
}); 

работает скрипка here