附加不适用于唯一的呼叫 ID

Posted 2023-03-11

【中文标题】附加不适用于唯一的呼叫 ID

【英文标题】：Appened is not working with calling id which is unique

【发布时间】：2017-05-15 09:03:31

【问题描述】：

这是我的代码，当单击按钮时，我想通过调用该 id 将按钮动态 id 显示到特定位置： 这是我的代码：

<span  id="2" class="view-details">View Details</span>
$( ".view-details" ).on( "click", function() 
var group = field.attr("id");
console.log(group);                     //Ex: value is coming as "2"
$("#groupID").append( group ); 

我的 html

 <span id="groupID"></span>             //i want to display the value "2" here

【问题讨论】：

您的问题不清楚，能否请您给出明确的解释？

【参考方案1】：

在您的代码中未定义 field 变量，而不是使用 this 来引用单击的元素并获取 id 属性。更新内容的方法是使用html() 或text() 方法，因为append() 方法只是在末尾插入新内容（现有内容会在那里）。

$(".view-details").on("click", function() 
  // get id property
  var group = this.id;

  // update the html contecnt of span element
  // or use `text()` method
  $("#groupID").html(group);
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="2" class="view-details">View Details 1</span><br>
<span id="3" class="view-details">View Details 2</span><br>
<span id="groupID"></span>

【讨论】：

它工作了感谢sn-p ..你能告诉我追加了什么问题吗..？

@AbdulWaheed ：这不会删除现有内容......即，每次点击都会附加内容...... 2,22,222，......

【参考方案2】：

如果我们只查看您提供的 sn-p，问题是您没有定义字段变量。但是，如果不需要，它会在您的跨度中添加 2 的次数与您单击的次数一样多，另一个答案已经解决了这个问题。

$( ".view-details" ).on( "click", function() 
field = $(this);
var group = field.attr("id");
console.log(group);                     //Ex: value is coming as "2"
$("#groupID").append( group ); 
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span  id="2" class="view-details">View Details</span>
<span id="groupID"></span>