亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

JS:在類構造函數中添加EventListener

JS:在類構造函數中添加EventListener

神不在的星期二 2023-09-21 10:56:12
我正在編寫一個評論系統。我在構建時遇到了問題Like Button。喜歡按鈕是一個很棒的字體<i>標簽作者不能喜歡自己的帖子一個用戶只能對一個帖子點贊一次單擊“喜歡”按鈕,通過切換類更改其純色填充。我所做的代碼非常巨大,不用費心閱讀下面的代碼片段,我只是提供它讓您了解發生了什么。<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>Document</title>    <meta name="viewport" content="width=device-width, initial-scale=1">        <!-- Fuentes de Google -->    <link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>    <!-- Iconos -->    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">    <link rel="stylesheet" href="comment.css" /></head><body><!-- <div id="shelf-image-comments">    <div class="comment">        <lable>Weilory</lable><p>Here</p>    </div></div> --><!-- Contenedor Principal -->    <div class="comments-container">        <h1>Comentarios <a href="http://creaticode.com">creaticode.com</a></h1>        <!-- <ul id="comments-list" class="comments-list">            <li>                <div class="comment-main-level">                    <div class="comment-avatar"><img src="http://i9.photobucket.com/albums/a88/creaticode/avatar_1_zps8e1c80cd.jpg" alt=""></div>                    <div class="comment-box">                        <div class="comment-head">                            <h6 class="comment-name by-author"><a href="http://creaticode.com/blog">Agustin Ortiz</a></h6>                            <span>hace 20 minutos</span>                            <i class="fa fa-reply"></i>                            <i class="fa fa-heart"></i>                            <i class="comment-likes">2</i>                        </div>                        <div class="comment-content">                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Velit omnis animi et iure laudantium vitae, praesentium optio, sapiente distinctio illo?                        </div>                    </div>                </div>
查看完整描述

1 回答

?
HUX布斯

TA貢獻1876條經驗 獲得超6個贊

您遇到的問題實際上是引用的陰影?!皌his”關鍵字不再適用于該類。它指的是事件路由到的元素。您可以將要綁定到“this”關鍵字的引用作為參數傳遞給 addEventListener 函數,如下所示:


this.el.addEventListener('click', function(){

            console.log('here');

            if(this.liked){

                this.unlike();

            }else{

                if(!this.like()){

                    return

                }

            }

            this.liked = !this.liked;

        }.bind(this));

再次澄清一下:


您有一個類,并且有一個封裝在其中的元素(類似于堅果和堅果殼)。構造函數中的“This”指的是您的類,第二個“this”指的是點擊處理程序中的 HTML 元素。


查看完整回答
反對 回復 2023-09-21
  • 1 回答
  • 0 關注
  • 108 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號