Question

如何找到具有电子邮件地址作为班级名称的元素。电子邮件地址是动态的。

$(document).ready(function(){
  //not working getting error
  var email="abc@gmail.com";
  $("#main").find("."+email);
  //not working
  $("#main").find("."+escapeSelecorchars(email));
});

function escapeSelecorchars = function(val) {
  return val.replace(/[!"#$%&'()*+,.\/:;<=>?@[\\\]^`{|}~]/g,"\\\\$&");
};

<div id="main">
  <div class="abc@gmail.com"></div>
</div>

Answer 1

我尝试这样的事情

JS：

$(function() {
  var email = "abc@gmail.com";
  var div = $("#main").find("div[data-email='"+email+"']");
});

HTML：

<div id="main">
  <div data-email="abc@gmail.com"></div>
</div>

这是一个有效的工作人员https://plnkr.co/edit/BDo9SvksNIfCLa6I0HfI

Answer 2

我同意将电子邮件地址用作课程可能不是最佳选择。但是，逃避方法无法正常工作的唯一原因是因为您错误地逃避了。您的替换值中有太多\。

应该是

function escapeSelecorchars(val) {
  return val.replace(/[!"#$%&'()*+,.\/:;<=>?@[\\\]^`{|}~]/g,"\\$&");
};

然后it works。

Answer 3

由于特殊字符，很难找到元素。

查看此代码

＆＃13;

$(document).ready(function(){
  //not working getting error
var ele = $("#main").find("div[data-email='abc@gmail.com']");
 
 
	console.log($(ele).attr('data-email'))

  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="main">
  <div data-email="abc@gmail.com" class="email"></div>
</div>

＆＃13;

Answer 4

使用 Attribute Equals Selector [class="value"”]

console.log($('#main > div[class="abc@gmail.com"]').length);

$(document).ready(function(){
  console.log($('#main > div[class="abc@gmail.com"]').length);
  
  $("#main").find("div[class='abc@gmail.com']").html("Appended");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main">
     <div class="abc@gmail.com"></div>
</div>

Answer 5

尝试

fish_user_key_bindings

或

$('#main div').filter(function(){ return $(this).attr('class') == 'abc@gmail.com'});

如何使用jQuery找到具有电子邮件地址作为类名的元素？

5 个答案: