Question

我有一个相当复杂的聊天应用程序，并且在同一个窗口中有多个聊天窗格，聊天条目，聊天提交等。起初我会做类似......

<input type="text" class="chattext" id="chattext-42">
<input type="text" class="chattext" id="chattext-93">
<input type="button" class="chatsubmit" id="chatsubmit-42">
<input type="button" class="chatsubmit" id="chatsubmit-93">

...等等（当然这是非常简化的，它们是在单独的div，单独的可见性等等）所以，当他们点击.chatsubmit时，它会得到它的id并找到聊天ID的最后两个字符。这提出了一些问题，因为如果ID改变了长度，它将需要重写，而且对我来说似乎很不合适。

然后我记得jQuery中的.data（）工具......我想，也许我可以这样做：

<input type="text" class="chattext"> ... and add a .data("id", 42) to this one
<input type="button" class="chatsubmit"> ... and add a .data("id", 42)

因此，当他们点击chatsubmit时，它会获取ID，然后找到带有该ID的chattext并对其进行处理。但是看一下文档，我看不到一种简单的搜索方法。例如，假设在这种情况下事件目标是chatsubmit，数据（'id'）为42 ......

var ID = $(event.target).data('id'); // Sets it to 42
var chattext = ...

在这里我遇到了麻烦。如何找到哪个DOM元素匹配一个chattext类和一个42的数据（'id'）？是否有任何简单的方法，或者我是否必须搜索每个.chattext以获取id为42的那个？或者还有另一种简单的方法吗？

我确实考虑过容器div有ID的可能性，我想，这会产生它吗？稍微容易得到。但如果这有效，那么它也可以处理其他容器div中的事情，这使得这不是一个长期的解决方案。

编辑：发布此信息后几秒钟，我发现：http://james.padolsey.com/javascript/extending-jquerys-selector-capabilities/包含有关将选择器扩展到数据的信息。所以我会尝试一下，与此同时，这是一种完全愚蠢的处理方式吗？

Answer 1

我没有看到使用“id”有什么问题，它肯定是找到东西的最快方法。如果你小心使用你使用的模式（例如，总是将数字键放在“ - ”或“_”字符后面），那么你可以使用正则表达式来分割键值：

  var key = $(this).attr('className').replace(/-(\d+)$/, "$1");

或其他什么。

当然，你仍然可以使用“数据”功能来存储密钥，如果从“id”值中获取它似乎很难看。但是，这不会打扰我。

编辑 - 如果你想要“清理”更多，你总是可以编写几个jQuery插件来获取密钥，并返回一个选择器来使用找到给定的“伙伴”元素。

是否可以使用.data（）作为搜索条件？

1 个答案: