Javascript 选择ID+；jquery中的任何数字

我对stackoverflow和jQuery都是新手，所以我在创建一个简单的函数时遇到了一些困难

基本上，我的网站中有一个随机数目的链接，id为“filtro”+“some number”，我只想为点击其中任何一个链接的操作编写一个代码（这将在以后对具有相同“filtro”+“some number”的类产生影响）

例如：单击“#过滤器3”，在“.filtro3”上执行操作。

问题是，我不知道如何在jQuery中为“任意数字”编写字符串。我正在考虑这样做：

$(function () {
    $("#" + "filtro" + SOME NUMBER).click(function () {
            //Do something with the element "." + "filtro" + SOME NUMBER
    });
});

有什么想法吗？谢谢

附：这是我的第一个问题，如果我犯了任何错误，我道歉

---

解决了。戴斯特罗伊的解决方案很有魅力

为了将来参考他人，我编写这段代码是为了为图片库制作一个简单的过滤菜单。这样，我可以隐藏/显示某些主题的图片。

您似乎想要

$(function () {
    $("[id^=filtro]").click(function () {
        var num = this.id.slice(6);
        // if there is a risk of ambiguity, you might check here that +num==num
        var $elem = $('.filtro'+num);
        ...
    });
});

说明：

• $（“[id^=filtro]”

  使用选择id以“filtro”开头的所有元素

• this.id.slice（6）获取id中第六个字符后开始的部分。如果
  this.id.slice（'filtro'.length）
  或
  this.id.substring（'filtro'.length）

[id^=filtro]

中的

^

是一个“起始于”选择器，它将

匹配
id起始于
filtro的任何元素

现在让我们使用一点正则表达式从ID中检索数字，

this.id.match（/\d+/）
获取“此单击的元素ID”名称并检索所有数字
d+

该数字用于匹配您的类元素选择器。
如果单击的元素的
ID
与您要更改的元素的
CLASS
相同，然后，它应该像使用元素的
id
作为类选择器的输入一样简单：

以您的代码为基础：

$(function () {
    $("[id^=filtro]").click(function () {
        $("." + $(this).prop("id")).some_method_here();
    });
});

例如，我假设目标元素是
s。这将导致任何具有匹配类的
元素显示为红色文本：

$(function () {
    $("[id^=filtro]").click(function () {
        $("div",  "#filterTest").css("color", "#000000");
        $("." + $(this).prop("id")).css("color", "#FF0000");
    });
});

既然我看到你是JQuery新手


正如dystroy所说，
$（“[id^=filtro]”
选择所有以“filtro”开头的元素
$（this）.prop（“id”）
获取当前元素（即刚刚单击的元素）的
id
$（“+$（this）.prop（“id”）
通过在开头添加“.”将该
id
作为类选择器的一部分。这将选择具有与所单击元素的
id
值相同的
class
值的所有元素

编辑：-您也可以使用
this.id
（标准JavaScript）代替
$（this.prop（“id”）
，这只是JQuery完成相同任务的方法。
对于您最初的问题，有一些很好的答案，但我想建议一个可能更干净的替代方法

您可以使用
data-*
属性而不是id来选择元素。例如，您的元素可能看起来像

<a data-filtro=6 href='...'>link</a>
<a data-filtro=7 href='...'>link</a>
<a data-filtro=8 href='...'>link</a>

<a data-filtro=6 data-foo data-bar href="...">link</a>

这项技术在许多地方，包括基础框架中使用。它可以更容易地将您的行为提取到一个独立的插件中，该插件不依赖于元素ID。随着应用程序变得越来越复杂，与每个元素相关的行为数量也在增加，每个元素看起来都会像

<a data-filtro=6 href='...'>link</a>
<a data-filtro=7 href='...'>link</a>
<a data-filtro=8 href='...'>link</a>

<a data-filtro=6 data-foo data-bar href="...">link</a>



而不是

<a id="filtro-6_and_bar_and_foo" href="...">link</a>


使用“属性开始于”选择器：或者，您可以使用
数据-*
而不是ID来选择元素。例如，
。然后，您可以选择使用
$（'[data filtro]'）
，并在回调中使用
$（this）.data（'filtro'）
。我觉得这样更干净。
我对stackoverflow和jQuery都是新手
-可能需要一点解释help@Ian你说得对，有些零件可能很难买到。我编辑过。你认为遗漏了什么吗？嗯，不，我认为这很好：）用正则表达式提取数字可能“更好”，但我认为你的示例/解释很好地说明了你是如何处理的谢谢，代码和解释非常完美。工作得很有魅力。这也比我想象的要简单得多。我也会编辑原始帖子以供他人参考。了解你的JS。使用
this.id
代替
$（this.prop）（“id”）
我知道我的JS。我改用JQuery，因为我已经在使用JQuery了。他在对dydstroy回答的评论中说，
我对stackoverflow和JQuery都是新手
。他似乎想了解更多关于JQuery的信息，所以我正在帮助他学习JQuery。@RokoC.Buljan-我添加了一条注释，解释了选项。我的第一条注释更多是针对OP而非您。这是一个很棒的观点！这绝对是一种组织方式：）