Question

我有一个简单的跨度

<span class="action removeAction">Remove</span>

此范围位于表格内，每行都有一个删除范围。

然后在点击该跨度时使用AJAX调用URL。 AJAX事件需要知道该行的对象的ID吗？将该ID添加到点击功能的最佳方法是什么？

我以为我可以做这样的事情

<span class="action removeAction" id="1">Remove</span>

但ID不应该以数字开头？对？然后我以为我能做到

<span class="action removeAction" id="my1">Remove</span>

然后从ID中删除'my'部分，但这似乎只是Yuk！

以下是我的点击事件以及我的AJAX事件。

<script type="text/javascript" language="text/javascript">

$(document).ready(function()
{

    $(".removeAction").click(function()
    {
        //AJAX here that needs to know the ID            
    }
});

</script>

我确信有一种很好的方法可以做到这一点吗？

注意：我不是在寻找

$(this).attr("id");

我希望能够传递多条信息

感谢。杰克。

Answer 1

如果您坚持使用旧式HTML 4.01或XHTML：

$('.removeAction').click(function() {
 // Don’t do anything crazy like `$(this).attr('id')`.
 // You can get the `id` attribute value by simply accessing the property:
 this.id;
 // If you’re prefixing it with 'my' to validate as HTML 4.01, you can get just the ID like this:
 this.id.replace('my', '');
});

顺便说一句，在HTML5中，the id attribute can start with a number or even be a number。

然后再说一次，如果你还在使用HTML5，你可能最好使用自定义数据属性，如下所示：

<span class="action removeAction" data-id="1">Remove</span>

Answer 2

点击函数中的

$（this）代表点击的元素

$(".removeAction").click(function() {
    //AJAX here that needs to know the ID
    alert($(this).attr('id'));           
}

Answer 3

以下代码将为您提供所点击span的ID。使用ID并不完美，但它会起作用。

$(".removeAction").click(function() {
  alert($(this).attr("id"));
});

Answer 4

您可以在每一行上有一个隐藏字段，用于存储JSON对象中所需的ID和/或其他数据。使用它而不是使用span标记进行黑客攻击。

<tr>
<td>
<span class="action removeAction">Remove</span>
<input type="hidden" value="1" />
</td>
</tr>

$('.removeAction').click(function(){
  var id = $(this).next().val();
  // do something...
});

HTH

Answer 5

您可以尝试jQuery.data（）：http://api.jquery.com/jQuery.data，但这意味着服务器端生成的js代码在页面加载时执行，以便您可以存储ID以供以后重用（您的删除操作）< / p>

// this part would have to be server 'generated'
// and by that I'm referring  to the '<?=$row_id?>'
$('table .remove').each(function(){

   var MyElem = $(this);
   MyElem.data('id', <?=$row_id?> );

   MyElem.click(function(){
      the_id = $(this).data('id');
      // ajax call goes here
   });

});

将数据传递给jQuery click（）函数

5 个答案: