如何使用jQuery (wordpress)动态定位命名元素ids
我正在构建一个wp主题，它调用所有到主页的页面。这些页面(post) ids是使用以下php id="post-<?php the_ID(); ?>"动态命名的，它们最终被命名为#post-1、#post-2、#post-3等等.
每个实例都以最小化状态被调用到主页，但是每个实例都有一个按钮，允许用户最大化该部分的内容。我通过使用jQuery在单击按钮时将类添加到该部分中嵌套的特定元素来实现这一点。
问题是，我不知道如何只分离嵌套按钮的部分。当前，当用户单击按钮时，它会将类添加到主页上的每个实例(每个页面(post)被调用到主页)。
有谁知道我如何编写一些jQuery，允许我使用动态命名的帖子分别针对每个部分，而不需要在jQuery函数中实际输入#post-1, #post-2, post-3, etc...？
下面是我正在做的事情的一个简化版本：
$('.open-entry').click(function(){
$(".home-article").addClass("open");
});.content {display: none;}
#home-article.open .content {display: block;}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<article id="post-<?php the_ID(); ?>" class="home-article">
<header class="home-closed-entry-header">
<button class="open-entry">explore</button>
</header> <!-- .home-closed-entry-header -->
<div class="content">
...some content
</div> <!-- .content -->
</article> <!-- .home-article -->
任何帮助都是非常感谢的！谢谢!
回答 2
Stack Overflow用户
发布于 2015-10-25 03:48:50
用横穿。在事件处理程序中，this引用发生在.考虑到作为起点，您可以遍历所需的部分dom。
closest()可以带您到主<article>，然后从那里可以使用find()查看实例中的内容。
$('.open-entry').click(function(){
var $article = $(this).closest(".home-article").addClass("open");
$article.find('.content').doSomething();
});Stack Overflow用户
发布于 2015-10-25 03:22:26
根据您的示例，有几种方法可以从按钮的上下文开始隔离section。
如果结构总是<section><header><button>，那么从按钮开始，您只需增加两个家长：
$("button").click(function() {
var thePost = $(this).parent().parent();
...
});如果按钮上方只有一个section元素，那么您可以查找父元素，即节元素：
$("button").click(function() {
var thePost = $(this).parents("section");
...
});如果要查找ID以"post-“开头的父类，则可以将ID视为属性并使用”属性以“选择器开头：
$("button").click(function() {
var thePost = $(this).parents("[id^=post-]");
...
});https://stackoverflow.com/questions/33325801
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号