Question

当您打开DIV（自定义或个性化）时，该功能将按预期运行，截断“+”并替换为“ - ”符号，但是当用户关闭DIV时，字符串将被复制并放入。< / p>

我希望结束时的行为与开头相同（截断并替换最后一个字符）

以下是代码：

HTML：

<div id="customize" class="leftDiv">
    <span class="smallTitle"  onclick="toggle_expand('customizePort');">Customize Portfolio &nbsp;&nbsp;&nbsp;&nbsp; +</span><br />
    <div class="leftDivContent" id="customizePort">
    LAYOUT:<BR />
    NAVIGATION:<BR />
    BACKGROUND COLOR:<BR />
    FONT COLOR:<BR />
    </div>
</div>

<div id="personalize" class="leftDiv">
    <span class="smallTitle" onclick="toggle_expand('personalizePort');">Personalize Portfolio &nbsp;&nbsp; +</span><br />
    <div class="leftDivContent" id="personalizePort">
        HEADER IMAGE:<BR />
        ARTIST STATEMENT:<br />
        CONTACT INFORMATION:<br />
    </div>
</div>

JAVASCRIPT：

function toggle_expand(id){
    var e = document.getElementById(id);
    var text = $(e).siblings().text();
    if( $(e).css('display') === 'none' ){
        $(e).slideToggle('fast', function(){
            var newText = text.replace("+","-");
            $(e).siblings().text( newText );
        });
    } else {
        $(e).slideToggle('fast', function(){
            var newText = text.replace("-","+");
            $(e).siblings().text( newText );
        });
    }
}

Answer 1

这似乎有你描述的效果：

function toggle_expand(id){
    var e = document.getElementById(id);
    var text = $(e).siblings("span").text();
    if( $(e).css('display') === 'none' ){
        $(e).slideToggle('fast', function(){
            var newText = $(e).siblings().text( text.slice(0, -1)+"-" );
        });
    } else {
        $(e).slideToggle('fast', function(){
            text = $(e).siblings("span").text( text.slice(0, -1)+"+" );
        });
    }
}

Answer 2

您的siblings选择器缺乏特异性。幽默地，<br>错误地添加了相同的文本，但是当显示下拉div时，它最初会被遮挡。

function toggle_expand(id) {
    var e = document.getElementById(id);
    var $title = $(e).siblings(".smallTitle");
    var text = $title.text();

在功能的其余部分中，请参阅$title而不是$(e).siblings("span")。

Answer 3

小regex爱怎么样：

function toggle_expand(id){
    var e = document.getElementById(id);
    var text = $(e).siblings("span").text();
    if( $(e).css('display') === 'none' ){
        $(e).slideToggle('fast', function(){
            var newText = $(e).siblings().text( text.replace(/\+/,'-'));
        });
    } else {
        $(e).slideToggle('fast', function(){
            text = $(e).siblings("span").text( text.replace(/-/,'+'));
        });
    }
}

尝试替换字符串中的最后一个字符，而不是字符串重复

3 个答案: