如何在没有onclick属性的帮助下在jQuery函数中传递值？

Question

我遇到一个问题,我需要将一个或多个参数传递给一个javascript函数.例如

<a href="#" OnClick="Delete(1,'q');" > X </a>
<a href="#" OnClick="Delete(2,'u');" > X </a>

但我试图onclick从html端避免这个属性.所以我用这种方式

<a  href="javascript://" title="Delete" id="actRemove" data-action="/List/Delete/1" ><span class="glyphicon glyphicon-remove"></span>Delete1</a>
<a  href="javascript://" title="Delete" id="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete2</a>
<a  href="javascript://" title="Delete" id="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete3</a>

并编写这样的jQuery函数来从链接捕获我的点击功能

$("#actRemove").each(function() {
   $(this).on("click", function () {
      alert($(this).data("action"));
   });
});

可惜!!我没说了.此链接仅适用于第一个锚点,Delete1没有任何锚点正在工作.这是我的jsFiddle链接.我已经完成了Q1,Q2,Q3,Q4,Q5,Q6这些答案.这些问题中的每个问题都以第一种方式使用onclick并将参数传递给函数.我的思维方式不同.而且我的另一个问题是,有没有什么办法来传递参数给一个jQuery function无需编写onclick的html属性？我知道jQuery函数能够接收参数,但是如何将它从html端发送到函数？

Answer 1

而不是id使用class选择器: -

HTML: -

<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/1" ><span class="glyphicon glyphicon-remove"></span>Delete1</a>
<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete2</a>
<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete3</a>

jQuery的: -

$(".actRemove").on("click", function () {
  alert($(this).data("action"));
});

工作演示: -

$(".actRemove").on("click", function () {
  alert($(this).data("action"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/1" ><span class="glyphicon glyphicon-remove"></span>Delete1</a>
<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete2</a>
<a  href="javascript:viod(0);" title="Delete" class="actRemove" data-action="/List/Delete/2" ><span class="glyphicon glyphicon-remove"></span>Delete3</a>

注意:-

id用作unique-selectorjQuery,同时class用作group-selector