jquery 复杂选择器类+属性

Question

我需要找到具有属性编号的类MyClass1的元素。我的尝试是：

 $(".MyClass1[number=" + userId + "]") 

但它没有用。我的错误在哪里？

 <tr class = "Myclass2">
    <td>
     <a href="#" number="5" title="checkselector" class="MyClass1">blablabla=)</a>           
    </td>
 </tr>

Answer 1

两个方面：

1. 您要匹配的内容

   如果您只想知道它有一个属性，而不是设置为特定值，请省略=和值：

   $(".MyClass1[number]") 
   

   这将匹配具有 number 属性和该代码行运行时存在的类MyClass1的任何元素。

   从您的编辑来看，听起来您正在尝试匹配特定数字。假设userId包含12：

   var userId = 12;
   

   。那么你的代码就可以了：

   $(".MyClass1[number=" + userId + "]") 
   

   。因为这计算结果为：

   $(".MyClass1[number=12]") 
   

   您可以在值两边加上引号，但仅当值包含空格或其他几个非字母数字字符时才需要这样做。如果您知道它是一个数字(因此仅包含数字(，则它们就没有必要。

2. 当您匹配它时

   早些时候我说"这将匹配任何元素......当那行代码运行时，它就存在。这很重要。如果代码位于元素上方的脚本块中，则找不到它，因为该元素尚不存在：

   <!-- Doesn't work -->
   <script>
       $(".MyClass1[number=12]").css("color", "green");
   </script>
   <!-- ... -->
   <a href="#" number="12" title="@Resources.Appoint" class="MyClass1">Joe BLoggs</a>
   

   但是如果脚本在之后，那么该元素存在并且可以找到：

   <a href="#" number="12" title="@Resources.Appoint" class="MyClass1">Joe BLoggs</a>
   <!-- Works -->
   <script>
       $(".MyClass1[number=12]").css("color", "green");
   </script>
   <!-- ... -->
   

   通常的建议是将脚本放在页面末尾，就在结束</body>标记之前。但是，如果你不能控制它们的去向，你可以使用 jQuery 的ready函数：

   $(document).ready(function() {
       // ...your code here...
   });
   

   。也可以缩短为：

   $(function() {
       // ...your code here...
   });
   

Answer 2

您缺少引号：

 $(".MyClass1[number='" + userId + "']")