字符串比较返回false。jQuery mobile下的奇怪JavaScript行为

Question

我开始使用jQuery mobile创建一个待办事项列表，以便更好地学习它。我正在监听来自菜单按钮的事件，例如：

        me.selectedTarget = me.menuNode.find(".ui-btn").first();

        me.menuNode.on("click", ".ui-btn", function (e) {
            var target =  $(e.currentTarget)
                ,targetText = target.text();
            console.debug("Click on'", targetText,"'" );
            if(target === me.selectedTarget) return;

            if(targetText == "View To Do "){
                core.pub("view:todo");
            } else if(targetText == "View Done ") {
                core.pub("view:done");
            } else {
                me.selectedTarget.click();
            }
            me.selectedTarget = target;
        });

变量targetText在结尾处有一个额外的“ ”空格，原因不明。我有3个按钮，但第三个按钮有点特殊-无关紧要。我的问题是我总是进入最后一个else子句。targetText从未等于“View To Do”或“View Done”。为什么“View Done”！=“View Done”？~X(。

Firebug调试结果如图所示。

HTML标记如下。

- Vlad Nicula

---

我的猜测是尾随空格丢失了，为什么不执行 $.trim("View Done ") == $.trim("View Done ")？你的字符串可能包含了 \t \r 或 \n，在调试器中显示为空格。 - Robert Louis Murphy

也许 $.trim 会有所帮助。从字符串字面量中删除额外的“空格”，并将 targetText 剪切 -> $.trim(targetText) == "View Done" - Engineer

我不知道jQuery中有trim函数 :O - Vlad Nicula

@工程师，你真是救了我的一天……显然这个愚蠢、无用且可能危害人类的问题今天仍然存在。我正在使用Angular 2，对字符串进行了纯JS修剪，结果它可用了……为了这样一个问题我已经疯了两个小时！再次感谢你。 - Giacomo Cerquone

Answer 1

比较失败是因为字符串不相同。所以问题实际上是：为什么它们不相同？显然，其中一个字符串中的空格不是标准空格字符（Unicode有多个空格），或者其中一个字符串中有一个不可见字符（Unicode也有这些）。

因此，为了找出发生了什么，我会这样做：

for (let index = 0; index < targetText.length; ++index) {
    console.log(`char at ${index}: ${targetText.charCodeAt(index)}`);
}

......并在您的代码中使用相同的字符串文字（不是重新输入，而是将其移入本地，然后输出它;因为如果您重新输入它，您可能会键入普通空格）。比较字符代码序列，您将发现差异。

- T.J. Crowder

---

去除空格的建议对我很有帮助。我想我应该考虑到两个看起来相同的东西可能有不同的表示方式。 - Vlad Nicula

我添加了HTML的屏幕截图。在那里看不到空格。但是我记得从jQuery文档中复制了前两个链接。也许复制粘贴在幕后添加了一些东西，因为.text()返回了额外的空格。 - Vlad Nicula

果然，它（末尾的字符）是一个非间断空格，Unicode字符160 - 即[U+00A0]（http://unicode.org/Public/UNIDATA/NamesList.txt）。如果标记中没有非间断空格，我想知道为什么它会出现在DOM元素中。很有趣，谢谢你告诉我代码是什么。 - T.J. Crowder

我找到了为什么会发生这种情况。jQuery Mobile在一个span标签中添加了一个 ，用于创建按钮的阴影效果。我猜测.text()方法并不是从jQ Mobile按钮中获取文本的最佳方式。我认为有一个特殊的函数可以实现这个功能...或者说按钮的标签并不适用于这种用法。 - Vlad Nicula

@VladNicula：不仅仅是空格……我刚刚花了一些时间处理“Μπιφτεκι γεμιστο”和“Μπιφτεκι γεμιστo” 剧透：一个“o”是希腊文，另一个是拉丁文。 - halfbit