Question

我想在我的Django网站上使用dotdotdot JS插件，但它对我不起作用。为什么？我只想要元素才能最终得到dotdotdot 这是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 %}

Answer 1

将ID更改为类，因为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({

dot dot dot JS插件不起作用

1 个答案: