0

由于我缺乏 jQuery 知识,我有点卡住了。将不胜感激任何帮助。我有以下脚本来激活扩展内容区域:

$(document).ready(function(){
    $("a.moreExpand").click(function(){
       var myelement = $(this).attr("rel");
        $(myelement).slideToggle(function() {
            $("a.moreExpand").text(
              $(this).is(':visible') ? "LESS -" : "MORE +"
            );
          });
    });
});

我的 HTML(在页面的不同位置使用):

<div class="moreExpandWrapp">
    <a href="javascript:void(0)" rel="#aboutExpand" class="moreExpand">MORE <span class="plus">+</span></a>
    <div class="moreExpandContent" id="aboutExpand">
        Lorem ipsum dolor sit amet ...
    </div>
</div>

到目前为止一切顺利,但是一旦我扩展/收缩内容区域,网站上的所有文本(更多/更少文本)都会更改。我试图像这样定位脚本:

$(document).ready(function(){
    $("a.moreExpand").click(function(){
       var myelement = $(this).attr("rel");
        $(myelement).slideToggle(function() {
            $("a.moreExpand", this).text(
              $(this).is(':visible') ? "LESS -" : "MORE +"
            );
          });
    });
});

所以它是: $("a.moreExpand", this).text( 但这当然无助于替换扩展的内容文本而不是链接文本。据我了解,这是因为“$this”值基本上是整个切换区域而不是按钮。

我想定位链接副本而不是扩展 div,但我不确定在这种情况下如何使用“$this”(改为定位函数的第一部分)。

非常感谢您对此的意见。

谢谢!

4

1 回答 1

1

实际上, JavaScript 中的this指的是您当前的作用域。

在 slideToggle 回调中,您的范围是指“滑动”元素,所以this === myElement. 您应该使用另一个 var 保留初始链接。

http://jsfiddle.net/t4CQt/

$("a.moreExpand").click(function(){
    var myLink = this,
        myelement = $(this).attr("rel");
    $(myelement).slideToggle('normal', function() {
        $(myLink).text(
            $(this).is(':visible') ? "MORE +" : "LESS -"
        );
    });
});
于 2013-04-17T10:02:19.823 回答