Question

我有这样的结构

<div class="spacedlinkboldwrap cat-heading">10-Step Courses</div><div class="spacedlinkwrap"><a href="/testimonials/10-steps-insecurity-relationships" class="purple-color">10 Steps to Overcome Insecurity in Relationships</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/10-steps-public-speaking" class="purple-color">10 Steps to Powerful Public Speaking</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/10-steps-self-esteem" class="purple-color">10 Steps to Solid Self Esteem</a></div>
<div class="spacedlinkboldwrap cat-heading">Addiction Help</div><div class="spacedlinkwrap"><a href="/testimonials/chocolate-addiction" class="purple-color">Chocolate Addiction</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/alcohol-abuse" class="purple-color">Diminish Alcohol Abuse</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/gambling-addiction" class="purple-color">Gambling Addiction</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/alcohol" class="purple-color">Stay Off Alcohol</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/obsessive-thoughts" class="purple-color">Stop Obsessive Thoughts</a></div>
<div class="spacedlinkboldwrap cat-heading">Alternative Cancer Treatments</div><div class="spacedlinkwrap"><a href="/testimonials/stay-positive" class="purple-color">Cancer - Stay Positive</a></div>
<div class="spacedlinkboldwrap cat-heading">Bad Habits</div><div class="spacedlinkwrap"><a href="/testimonials/lip-biting" class="purple-color">Lip Biting</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/nail-biting" class="purple-color">Stop Nail Biting</a></div>
<div class="spacedlinkboldwrap cat-heading">Clinical Hypnotherapy</div><div class="spacedlinkwrap"><a href="/testimonials/noise-sensitivity" class="purple-color">Noise Sensitivity</a></div>
<div class="spacedlinkboldwrap cat-heading">Communication Skills</div><div class="spacedlinkwrap"><a href="/testimonials/meeting-people" class="purple-color">Meeting People</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/speaking-groups" class="purple-color">Speaking Clearly</a></div>
<div class="spacedlinkboldwrap cat-heading">Customer Service</div><div class="spacedlinkwrap"><a href="/testimonials/general/customer-service" class="purple-color">Feedback from our customers</a></div>
<div class="spacedlinkboldwrap cat-heading">Depression Self Help</div><div class="spacedlinkwrap"><a href="/testimonials/depression-treatment" class="purple-color">Full Depression Treatment</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/managing-bipolar-disorder" class="purple-color">Managing Bipolar Disorder</a></div>
<div class="spacedlinkboldwrap cat-heading">Emotional Intelligence</div><div class="spacedlinkwrap"><a href="/testimonials/be-kinder" class="purple-color">Be Kinder</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/dealing-guilt" class="purple-color">Dealing with Guilt</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/jealousy" class="purple-color">Overcome Jealousy</a></div>
<div class="spacedlinkboldwrap cat-heading">Fears and Phobias</div><div class="spacedlinkwrap"><a href="/testimonials/dentist" class="purple-color">Dental Phobia</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/driving-test" class="purple-color">Driving Test</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-bridges" class="purple-color">Fear of Bridges</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-driving" class="purple-color">Fear of Driving</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-failure" class="purple-color">Fear of Failure</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-flying" class="purple-color">Fear of Flying</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-heights" class="purple-color">Fear of Heights</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/travel" class="purple-color">Fear of Travel</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/hayfever-relief" class="purple-color">Fear of Water</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-of-women" class="purple-color">Fear Of Women</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/singers-nerves" class="purple-color">Musicians &amp; Singers Nerves</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/fear-anxiety" class="purple-color">Overcome Fear &amp; Anxiety</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/claustrophobia" class="purple-color">Overcoming Claustrophobia</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/performance-anxiety" class="purple-color">Performance Anxiety</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/panic-attacks" class="purple-color">Stop Panic Attacks</a></div>
<div class="spacedlinkboldwrap cat-heading">Fun Hypnosis</div><div class="spacedlinkwrap"><a href="/testimonials/cloud-nine" class="purple-color">Cloud Nine</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/happy-days" class="purple-color">Happy Days</a></div>
<div class="spacedlinkboldwrap cat-heading">Health Issues</div><div class="spacedlinkwrap"><a href="/testimonials/essential-tremor" class="purple-color">Essential Tremor</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/migraines" class="purple-color">Get Rid of Migraines</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/hayfever-relief" class="purple-color">Hayfever Relief</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/healing" class="purple-color">Healing Power Hypnosis</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/improve-posture" class="purple-color">Improve Posture</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/prepare-surgery" class="purple-color">Prepare for Surgery</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/restless-legs" class="purple-color">Restless Legs Syndrome</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/teeth-grinding" class="purple-color">Teeth Grinding</a></div>
<div class="spacedlinkwrap"><a href="/testimonials/wart-treatment" class="purple-color">Wart Treatment</a></div>

这个类名是我的类别：spacedlinkboldwrap cat-heading，它的子类别是spacedlinkwrap。现在我想跟踪用户点击的类别名称......但我没有进入这个结构。< / p>

Answer 1

您可以使用jQuery .prevAll：

演示：http://jsfiddle.net/abhitalks/rLQdv/

示例代码：

$("a").on("click", function(e) {
    e.preventDefault();
    var $p = $(this).parent();
    var cat = $p.prevAll(".cat-heading").html();
    alert(cat);
});

来自此参考：http://api.jquery.com/prevall/

给定一个表示一组DOM元素的jQuery对象， .prevAll（）方法搜索这些元素的前身在DOM树中并从匹配中构造一个新的jQuery对象要素;元素按顺序返回最亲密的兄弟姐妹。

请注意最后一行：“元素按照从最近的兄弟开始的顺序返回”

因此，代码$p.prevAll(".cat-heading").html()将获得与目标锚点最接近的第一个匹配元素的内容。

修改：

根据你上面的评论，你正在使用jQuery 1.4;所以只需用.on("click"..语法替换.click(..语法。或.bind("click"..语法。

在javascript中反向遍历

1 个答案: