Javascript 带有警报（右！）消息的触发器计数

我正在开发一个拖放功能，它告诉您是否已将元素拖动到其相应的类别（此部分已排序）。我还需要在每次触发相应警报时触发正确答案计数。可能吗？在本例中，我使用了sweet alert库，我可以告诉text:是我想要使用的属性

下面是这个特定部分的Html/Javascript代码

if (event.target.className == "dropzone" && dragged.attributes.group.value == event.target.attributes.group.value) {
event.target.style.background = "";
dragged.parentNode.removeChild(dragged);
event.target.appendChild(dragged);
//console.log('test');
swal({
  text: 'RICHTIG!',
  timer: 2000,
  buttons: false,
}).then(
  //where i want to count no. of RICHTIG! triggered using the text property
  function () {},
  //handling the promise rejection
  function (dismiss){
    if (dismiss === 'timer'){
      //console.log('I was closed by the timer')
    }
  }
)

}

}))

HTML:

米特拉乌弗雷夫特酒店

法尔希·梅赫海特

无知的多元化

你有正确的答案。

---

更新2:未捕获的TypeError$（..）。Dragable不是已解析的函数。计数器仍然没有执行。

一切都有可能，但您有什么问题？谢谢您的回复。我只是不知道如何为它编写正确的函数。我已经浏览过互联网，我能想到的最好的方法是用onclick（）或windows.onload事件触发。只要在用户输入正确的asnwer时增加一个计数器即可。。我不明白这个问题

<div>
You have <span id="score">0</span>right answers. 
</div>

$(function(){
//set intitial score to 0
var score = 0;
//and put it into the html
$("#score").find("span").html(score);

//increment score
var incrementScore = function(){
    return ++score;
}

//update the score after calling the incrementScore() func
var updateScoreHtml = function(){
    $("#score").find("span").html(incrementScore());
}

$("b-line").draggable({
    hide: function(){
        $(this).hide();
    }
});

$(".dropzone").droppable({
    drop:function (event,ui){
        ui.draggable.hide();
        updateScoreHtml();
    }
});

<div id="kategorie">
        <img class="pfeil" draggable="false" src="img/pfeil_breiter-01-01.png" alt="pfeil">
        <img class="dropzone" group="1" id="kategorie1" draggable="false" ondrop="drop(event)" ondragover="allowDrop(event)" src="img/kategorie1.jpg" alt="kategorie1">
        
        <img class="dropzone" group="2" id="kategorie2" draggable="false" ondrop="drop(event)" ondragover="allowDrop(event)" src="img/kategorie2.jpg" alt="kategorie2"> 
       
        <img class="dropzone" group="3" id="kategorie3" draggable="false" ondrop="drop(event)" ondragover="allowDrop(event)" src="img/kategorie3.jpg" alt="kategorie3"> 
    </div>
    <div class="kasten" id="effekte">
        <div class="b-line" id="texte1" group="2" draggable="true" ondragstart="drag(event)">
            <p>Mitläufereffekt</p>
            <p>Falsche Mehrheit</p>
            <p>Pluralistische Ignoranz</p>
         </div>
        </div>
<div>
You have <span id="score">0</span>right answers. 
</div>