Question

我在jquery中附加了一个“字符串”，并希望将其删除并添加一个新的“字符串”。

创建一个简单的标记来显示

<a href="#">Test</a>
<button>remove</button>

var c = " closed";
var o = " open";
$("a").append(c);
$("button").click(function(){
 $("a").find(c).replaceWith(o);
  $("a").append(o);
});

http://codepen.io/denniswegereef/pen/KpOjpr

Answer 1

Jquery使用元素而不是文本。

var c = " closed";
var o = " open";
var el_c = $('<span>').text(c);
var el_o = $('<span>').text(o);
$("a").append(el_c);
$("button").click(function(){
    el_c.replaceWith(el_o);
});

Answer 2

您需要将字符串封装到要更改的SPAN或DIV中，如下所示：

<a href="#">Test <span>closed</span></a>

使用此结构，您可以像这样更改A中SPAN的innerHTML：

$('a span').html(o);

OR：

$('a span').html(c);

Answer 3

您的整体可以替换为

$("button").click(function() {
  ($("a span").text() === "open") ? $("a span ").text("close") : $("a span").text("open");
});

http://jsfiddle.net/5vpn82c0/3/

Answer 4

使用html()

检查此解决方案

var c = " closed";
var o = " open";

var a = $('#anchor');
a.append(c);

$('#btn').click(function(){
    var txt = a.text();
    var prefix = 'Test';
    if(txt.indexOf(c) != -1) {
      a.html(prefix + o);
    } else if (txt.indexOf(o) != -1) {
      a.html(prefix + c);
    } 
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a id="anchor" href="#">Test</a>
<button id="btn">remove</button>

Answer 5

我想这支笔可以达到您想要达到的效果： http://codepen.io/anon/pen/zGgVzG

var c = " closed";
var o = " open";
$("a").append(c);
$("button").click(function(){
    $("a").text($("a").text().replace(c, o));
});

你不能使用jQuery的find（）和替换方法来替换文本。这些工作在dom元素上，而不是字符串上。使用文本函数设置链接的文本，并使用JavaScript的本机替换函数进行文本替换。为了澄清，下面的代码与上面的代码相同，但可能更容易理解：

var c = " closed";
var o = " open";
$("a").append(c);
$("button").click(function(){
    var linkText = $("a").text();
    var replacedText = linkText.replace(c, o);
    $("a").text(replacedText);
});

Answer 6

使用两个不同的类创建两个span。命名＆＃39;关闭＆＃39;并打开＆＃39; 然后是一面旗帜

var s_c = '<span class="close">close</span>';
var s_o = '<span class="open">open</span>';
var flag = 'c';
$("a").append(s_c);
$("button").click(function(){
    if(flag == 'c')
    {
        $("a").find('span').remove();
        $("a").append(s_o);
        flag = o;
    }
    if(flag == 'o')
    {
        $("a").find('span').remove();
        $("a").append(s_c);
        flag = c;
    }
});

记住这段代码用于切换文字......！曾经一度关闭开放... 如果你只寻找一次，有人会回答最重要的问题。祝好运！

单击时删除并替换附加

6 个答案: