jQuery显示/隐藏Div [英] jQuery Show/Hide Div

问题描述

我正在将它用于show/hide div扩展器，它可以正常工作，但是HTML实体没有被输出.

I'm using this for a show/hide div expander, which is working fine, however, the HTML entities aren't being outputted.

$(document).ready(function() {
    $('.slickbox').hide();
    $("#slick-toggle").toggle(function() {
        $(this).text("▲ See Less");
        $('.slickbox').slideToggle(500);
    }, function() {
        $(this).text("See More ▼");
        $('.slickbox').slideToggle(500);
    });
});

它没有显示向上或向下箭头实体，而是输出

Instead of showing the up or down arrow entities, it just outputs

▼

我怎样才能使它输出实体?

How can I make it so it'll output the entities?

推荐答案

.text已经完成了从文本"到"HTML"的转换.

.text already does the conversion from "text" to "HTML" itself.

来自文档:

我们需要知道这种方法 转义提供的字符串 必要的，以便它将呈现 在HTML中正确显示.为此，它调用 DOM方法.createTextNode()， 将特殊字符替换为 它们的HTML实体等价物(例如 <为<).

We need to be aware that this method escapes the string provided as necessary so that it will render correctly in HTML. To do so, it calls the DOM method .createTextNode(), which replaces special characters with their HTML entity equivalents (such as < for <).

因此，从您的角度来看，您的文本将从 verbatim 转换为▲.

So your text is being converted to ▲ and thus being rendered, from your point-of-view, verbatim.

您可以将文字直接编码为字符串(注意Javascript \u需要十六进制而不是十进制):

You can encode the literal directly into the string (noting that the Javascript \u expects Hex, not Decimal):

$(this).text("\u25B2 See Less");

如果要使用HTML实体:

If you want to use the HTML entities:

$(this).html("▲ See Less");

请参见此jsfiddle.net代码段，其中显示:

• 您的方法
• 将文字直接编码为Javascript字符串的有效方法
• .html的方法.

• Your approach
• A valid approach with encoding the literal directly into the Javascript string
• The approach with .html.

这篇关于jQuery显示/隐藏Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！