Question

我有一个可折叠的链接，上面有unicode箭头

►This is a collapsible link

当有人点击它时，我希望它变成向下箭头▼。但是我无法弄清楚如何解析替换这个角色。

这是我的代码：

function CollapsibleContainerTitleClickApp(){
     $(".collapsibleContainerContent.app", $(this).parent()).slideToggle();
     alert($(this).text().trim().charAt(0));
     if ($(this).text.trim().charAt(0) == "\u25B8"{
        alert("inside the if statement");
        $(this).text($(this).text().replace("\u25B8", "\u25BE"));
     }else{
        $(this).text($(this).text().replace("\u25BE", "\u25B8"));
}

现在第一个警报总是弹出，因为实际箭头（►）和查看源也有实际箭头。如何查看第一个字符是否为一个箭头，如果是，请将其替换为另一个箭头？第二个警告语句永远不会触发，因此它永远不会传递if的条件。

Answer 1

您的if语句中有多个错误，这就是永远不会命中该分支的原因。

if ($(this).text.trim().charAt(0) == "\u25B8"{

您忘记了)声明的结束if。

此外，您没有调用text()方法，而是尝试将其作为成员访问，而不是。

您的代码应如下所示：

if ($(this).text().trim().charAt(0) == "\u25B8") {

Answer 2

您也可以使用css和jQuery解决这个问题：

CSS：

.collapsible_link:before { content: "\25BC"; }
.collapsed_link:before { content: "\25BA"; }

jQuery的：

$('#link').click(function(o) {
   $(o).toggleClass('collapsible_link collapsed_link');
});

Answer 3

charCodeAt(index)返回指定索引处字符的整数unicode值。这通常是测试单个char值的最简单方法 - 尤其是当它们不可打印时，或者以其他方式特殊时。 (docs at w3schools)

另外......确保您正在比较正确的unicode值。 "\u25B8"是“小右箭头”（▸） - 但您在示例中显示的箭头是“大右箭头”，即"\u25BA"（► ）

所以...使用charCodeAt() 和正确的unicode值的简单示例：

var s = "►This is a collapsible link";
if(s.charCodeAt(0) === 0x25BA) {
   alert( "true!");
}

Jquery，检查charAt（）是否等于unicode字符？

3 个答案: