Javascript 自定义函数不使用append方法

我有一个自定义插件（来自），用于我的段落标记中，如果溢出，则使其省略号

//ellipsis
        $(".custom").dotdotdot({
            /*  The HTML to add as ellipsis. */
            ellipsis    : '...',
            /*  Wrap-option fallback to 'letter' for long words */
            fallbackToLetter: true,
            /*  Optionally set a max-height, if null, the height will be measured. */
            height      : 40,
        });

这是我的HTML

<div class="mainWrapper">
    <div class="drop">
        <p class="custom">
            Sub Division Title Sub Division Title Sub Division Title
        </p>
    </div>
</div>    

<a class="myBUtton"> click me</a>   

分部名称分部名称分部名称分部名称分部名称

点击我

对于我的项目，我必须通过单击.myBUtton来附加.custom段落。我曾经

$('.mainWrapper').on('click', '.myBUtton', function() {
            $(".drop").append('<p class="custom">Sub Division Title Sub Division Title Sub Division Title</p>');

        });

$（'.mainWrapper'）。在（'click'，'.myBUtton'，function（）上{
$（“.drop”）.append（“
子分部标题子分部标题子分部标题
”）；
});

但是如果我用append方法追加该段落，dotdot函数不起作用。没有附加，但不知道附加后为什么不工作。有没有合适的方法可以做到这一点。可能是我做错了或遗漏了什么。任何帮助都将不胜感激

---

谢谢

将

$（“.custom”）.dotdotdot（{//your code}）

放入函数中，然后在append事件后调用此函数。

将

$（.custom”）.dotdotdot（{//your code}）放入函数中，然后在append事件后调用此函数。
myBUtton
不在
内。mainWrapper
，当事件在链中冒泡时，将事件委派给非父元素的元素将不起作用，而不是委派给兄弟元素

$('.mainWrapper').on('click', '.myBUtton', function() {...

使用实际的父元素或文档

$(document).on('click', '.myBUtton', function() {

.myBUtton
不在
.mainWrapper
内，将事件委派给非父级的元素将无法工作，因为事件会在链中冒泡，而不是委派给同级元素

$('.mainWrapper').on('click', '.myBUtton', function() {...

使用实际的父元素或文档

$(document).on('click', '.myBUtton', function() {

问题是a.myButton不是.mainWrapper子代的一部分，而是它的兄弟。这就是为什么你不能利用这次事件的原因

你可以

$('.mainWrapper + .myBUtton').on('click', function(e){
    $(this).prev().append('<p class="custom">...text here...</p>');
});

$（'.mainWrapper+.myBUtton'）。打开（'click'，函数（e）{
$（this.prev（）.append（'
…此处的文本…
）；
});

或者使用事件委派机制，您必须将处理程序附加到所有
.myButton
元素的第一个公共祖先上，然后在此处理程序中执行任何您想执行的操作，如
$（this）.prev（）.append（'
…text here…
'））
如果它以前的同级仍然是.mainWrapper

。

问题在于a.myButton不是.mainWrapper子代的一部分，而是它的同级。这就是为什么你不能利用这次事件的原因

你可以

$('.mainWrapper + .myBUtton').on('click', function(e){
    $(this).prev().append('<p class="custom">...text here...</p>');
});

$（'.mainWrapper+.myBUtton'）。打开（'click'，函数（e）{
$（this.prev（）.append（'
…此处的文本…
）；
});

或者使用事件委派机制，您必须将处理程序附加到所有

.myButton

元素的第一个公共祖先上，然后在此处理程序中执行任何您想执行的操作，如

$（this.prev（）.append（'
…text here…
）

，如果其以前的同级仍然是

.mainWrapper