如何将数据添加到 HTML 中的锚标记并使用 jQuery 访问它？答案

【问题标题】：How to add data to the anchor tag in HTML and access it using jQuery?如何将数据添加到 HTML 中的锚标记并使用 jQuery 访问它？
【发布时间】：2014-05-02 18:56:33
【问题描述】：

以下是我的锚标记的 HTML 代码：

<a delhref="http://localhost/eprime/entprm/web/control/modules/questions/manage_question_issue.php?op=fixed&question_id=21627&que_issue_status=0" title="Fixed" href="#fixedPopContent" class="fixed">Fixed</a>

现在我想向上面的锚标记添加一个问题 ID，并在用户单击此超链接时在 jQuery 中访问它。为此，我尝试了下面的代码，但对我没有用。

<a delhref="http://localhost/eprime/entprm/web/control/modules/questions/manage_question_issue.php?op=fixed&question_id=21627&que_issue_status=0" title="Fixed" href="#fixedPopContent" class="fixed" data="21627">Fixed</a>

它的jQuery代码如下：

$(document).ready(function()  {
  $(".fixed").click(function(e) {
    var t2 = $(this).data();
    alert(t2);
  });
});

它在警告框中给了我消息 [object Object]。谁能帮我将值设置为锚标记并在 jQuery 中访问它？

【问题讨论】：

标签： javascript jquery html anchor href

【解决方案1】：

我假设你正在尝试做这样的事情：

$(document).ready(function()  {
  // you can change the selector, `"key"` and its value below
  $("a.fixed").data("key", 21627); // on document ready, store the necessary data
  //                        ^-- Insert a dynamic value here if required

  $(".fixed").click(function(e) {    
    alert($(this).data("key"));  // 21627
  });

});

.data() 存储一个键值对。所以在这里，我创建了一个名为'key' 的键，并与它一起存储了一个值21627，并在单击时提醒与键'key' 对应的值。

您得到一个[object Object] 的原因与.data() 将数据存储在对象中的原因相同，并且通过将零参数传递给它，您实际上是将与.fixed 关联的对象存储到t2 中。

【讨论】：

实际上我分配给数据属性的值是动态的。为了便于理解，我给了 (21627) 一个硬编码值。我想要一个通用的解决方案。
那也没问题，您可以将动态值传递给$("a.fixed").data("key", 21627); 的调用来代替21627。

【解决方案2】：

试试这样的

html

 <a  href="#fixedPopContent" class="fixed" data-q_id="21627"></a>

javascript

$(document).ready(function()  {
  $(".fixed").click(function(e) {
    var t2 = $(this).data('q_id');
    alert(t2);
  });
});

您可以在 html 元素上添加属性 data-sample_name。在 jquery 中使用

$('your_element_id').data('sample_name');// to get value
$('your_element_id').data('sample_name','new value');// to set  value

【讨论】：

会支持所有版本的浏览器吗？

【解决方案3】：

一种更简单的方法是：

在锚标记中使用 id 属性来写入数据。

<a id="your-data" onclick="callfunction(this.id)">Fixed</a>

在像callfucntion(id)这样的js文件中创建一个函数。

function callfucntion(id) { var data = id; // if more than one data, you can se split() }

【讨论】：