0

我想在我的 Django 网站上使用 dotdotdot JS 插件,但它对我不起作用。为什么?我只想元素在最后有点点这是HTML头:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script type="text/javascript" language="javascript" src="/static/mainpage/dotdotdot-1.6.5/jquery.dotdotdot.min.js"></script>
    <script type="text/javascript" language="javascript">
        $(document).ready(function() {
        $("#prispevek").dotdotdot({
            /*  The HTML to add as ellipsis. */
            ellipsis    : '... ',

            /*  How to cut off the text/html: 'word'/'letter'/'children' */
            wrap        : 'word',

            /*  Wrap-option fallback to 'letter' for long words */
            fallbackToLetter: true,

            /*  jQuery-selector for the element to keep and put after the ellipsis. */
            after       : null,

            /*  Whether to update the ellipsis: true/'window' */
            watch       : false,

            /*  Optionally set a max-height, if null, the height will be measured. */
            height      : null,

            /*  Deviation for the height-option. */
            tolerance   : 10,

            /*  Callback function that is fired after the ellipsis is added,
                receives two parameters: isTruncated(boolean), orgContent(string). */
            callback    : function( isTruncated, orgContent ) {},

            lastCharacter   : {

                /*  Remove these characters from the end of the truncated text. */
                remove      : [ ' ', ',', ';', '.', '!', '?' ],

                /*  Don't add an ellipsis if this array contains 
                    the last character of the truncated text. */
                noEllipsis  : []
            }
        });
    });
    </script>

这是CSS:

#prispevek

{
    height:80px;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
    text-align: justify;
}

这是我的身体:内容是通过 Django

{% for object in prispevky %}
    <article>
        <h1><a href="novinky/{{ object.id }}/">{{ object.nadpis }}</a></h1>
        <p id="prispevek">{{ object.text|linebreaksbr }}</p>
    </article>
{% endfor %}
4

1 回答 1

0

将 Id 更改为 class,因为 id 是唯一的,并且您将其附加到循环中。

{% for object in prispevky %}
    <article>
        <h1><a href="novinky/{{ object.id }}/">{{ object.nadpis }}</a></h1>
        <p class="prispevek">{{ object.text|linebreaksbr }}</p>
    </article>
{% endfor %}

CSS

.prispevek

{
    height:80px;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
    text-align: justify;
}

jQuery

$(document).ready(function() {
        $(".prispevek").dotdotdot({
于 2013-09-12T08:44:39.283 回答