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 !!!");

    })
}

但是当我点击＆＃34; Show＆＃34; ，它没有用。

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>

正如其他答案中所建议的那样，ID已经是DOM元素的唯一标识符，因此实际上不需要在选择器中使用两个ID，甚至可能在内部减慢查找正确的节点。

Answer 2

使用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

Answer 3

仅在选择器中使用一个ID
在准备好文档后放置代码$(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>

单击标签显示警报时 - Jquery

3 个答案: