Question

我正在使用Cordova报价生成器应用程序，用户可以在其中添加自己的自定义报价。

我有一个默认引号列表，这些引号存储为JavaScript对象以供参考。我正在测试一个for循环，以将所有引号显示在一个列表中，该主意是将它们显示为按钮，以便用户可以单击引号并编辑文本。

我的问题是，在使用.append()向<li>添加<ul>元素时，显示的HTML仅显示大写字符和标点符号。

还有其他一些奇怪的字符，使该问题看起来像是Unicode问题，但我不确定。我试图在按钮显示报价作者的位置进行测试。我使用quoteSource[i].name引用了该名称。

编辑：我确实检查过我的CSS是否具有想要的字体，并将其声明为!important，并且没有看起来像所显示字体的字体。我确实尝试过手动添加代码，并且按预期方式工作。

我的JS对象中的一些代码：

var quoteSource=[
    {
        id: 1,
        quote: "Start by doing what's necessary; then do what's possible; and suddenly you are doing the impossible.",
        name:"Francis of Assisi"
    },
    {
        id: 2,
        quote:"Believe you can and you're halfway there.",
        name:"Theodore Roosevelt"
    },
    {
        id: 3,
        quote:"It does not matter how slowly you go as long as you do not stop.",
        name:"Confucius"
    },
    {
        id: 4,
        quote:"Our greatest weakness lies in giving up. The most certain way to succeed is always to try just one more time.",
        name:"Thomas A. Edison"
    },
    {
        id: 5,
        quote:"The will to win, the desire to succeed, the urge to reach your full potential... these are the keys that will unlock the door to personal excellence.",
        name:"Confucius"
    },
    {
        id: 6,
        quote:"Don't watch the clock; do what it does. Keep going.",
        name:"Sam Levenson"
    },
    {
        id: 7,
        quote:"A creative man is motivated by the desire to achieve, not by the desire to beat others.",
        name:"Ayn Rand"
    },
    {
        id: 8,
        quote:"Start where you are. Use what you have. Do what you can.",
        name:"Arthur Ashe"
    },
    {
        id: 9,
        quote:"Ever tried. Ever failed. No matter. Try Again. Fail again. Fail better.",
        name:"Samuel Beckett"
    },
    {
        id: 10,
        quote:"Be yourself; everyone else is already taken.",
        name:"Oscar Wilde"
    }];

我显示列表的功能：

function customQuotes() {
    quoteTitle.innerHTML = "Custom Quotes";
    quoteActivity.style.display = "block";
    addButton.style.display = "block";
    quoteList.html('');
    for(i=0;i<sourceLength;i++) {
        quoteList.append('<li class="item-list-li"><i class="material-icons list-item-icon>edit</i><p class="list-item-text">' + quoteSource[i].name + '</p></li>'); 
    }

}

我确实有另一个功能，与上面的功能相似，它将整个报价对象显示在屏幕上似乎正常。以下是该代码段：

function setQuote(a) {
    newQuoteText = quoteSource[a].quote;
    newQuoteGenius = quoteSource[a].name;
    newQuoteId = quoteSource[a].id;
    if ((newQuoteGenius === null) || (newQuoteGenius == "") || (newQuoteGenius == " ")) { newQuoteGenius = "Unknown" }
    quoteContainer.fadeOut(timeAnimationIn, function () {
        quoteContainer.html('');
        quoteContainer.append('<p class="quote">' + newQuoteText + '</p>' + '<p id="name" class="name">' + '-' + newQuoteGenius + '</p>');
        quoteContainer.fadeIn(timeAnimationOut);
    });
}

我还注意到，当尝试从“材质图标”打印“编辑”字符时，该字符未显示在文档中。另外，字体是不正确的，应该看起来像标题中的字体（参考所附图像）。

下面是一些屏幕截图，我圈出了两个使我怀疑Unicode问题的字符：

这是我的问题。要查看其外观，只需在JS底部的customQuotes()调用中添加注释。 https://jsfiddle.net/dbzte38m/

JQuery .append（）仅附加大写字符

0 个答案: