jquery - 使用 jQuery 定位外部父级的 css

Question

我们正在更新我们的客户调查问卷，该调查问卷的设置是为了让他们返回并更新或编辑他们的答案。每个问题(元素)的基本 html 如下:

<div class="item">
  <span class="blue">The question ?</span>
  <div class="answer">
    Previous Answer <a href="" class="editlink">edit</a>
  </div> <!-- end div answer -->
  <div class="question">
    <textarea name="item-name" class="w90">Previous Answer or empty</textarea>
  </div> <!-- end div question -->
</div> <!-- end div item -->

从数据库加载时，如果有以前的答案，则答案 div 将显示，问题 div 将被隐藏并填充以前的答案。如果客户单击编辑链接，则答案 div 应该隐藏并显示问题 div。

如果之前没有答案，那么问题 div 将显示，空答案 div 将被隐藏。

我的想法是创建两个元素类，.item-answered 和 .item-not-answered 来反射(reflect) answer 和 question 可能存在的两种状态。然后在页面首次由 PHP 构建时使用这些类。

但我想弄清楚如何使用 jQuery 的自动功能来允许单击编辑链接来更改外部父级的 css(在我上面的 html 中标记为“元素”)。

Answer 1

您正在寻找父 jQuery 方法。 ( http://api.jquery.com/parent/ )

尝试这样的事情:

<a href="#" onclick="$(this).parent().addClass('item-not-answered');" class="editlink">edit</a>