Почему указатель мыши меняется на стрелку и не запускает событие щелчка по значку?

Question

Я использую значок в своем приложении MVC Core. при наведении указателя мыши на значок должна отображаться всплывающая подсказка, позволяющая мне запускать событие при нажатии. Я установил курсор свойства css на «указатель».

В моем случае, когда я наводил указатель мыши на значок, курсор быстро менялся с указателя на стрелку. Поскольку он превращается в стрелку, я не могу вызвать событие щелчка.

Я полностью сбит с толку.

<i class='fa fa-plus-square fa-lg displaytooltip' id='idAdd'  title='' style = 'cursor:pointer;color:orange' onclick=Add();></i >

Пример видео

Answer 1

Фактически, пока вы не отключите событие щелчка элемента и не добавите событие onclick подробно, независимо от того, в каком состоянии находится курсор мыши, вы все равно можете инициировать событие щелчка.

Предполагается, что вы должны click on the element itself, а не где-либо еще.

 @{
    ViewData["Title"] = "Index";
    Layout = null;
}   
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script>  
    function Add() {
        alert("clicked!");
    }
</script>
<i class='fa fa-plus-square fa-lg displaytooltip' id='idAdd' title='click me'
   style='cursor:pointer;color:orange' onclick=Add();>
</i>

Это результат теста:

Answer 2

вам нужно вызвать функцию в "" или '' Quotation mar k

    <button onclick="myFunction()">Click me</button>

вы не добавили функцию в "" или '' кавычки поэтому он также не работает

---

там не нужно добавлять точку с запятой (;) для закрытия вашей функции

<i class='fa fa-plus-square fa-lg displaytooltip' id='idAdd'  title='' style = 'cursor:pointer;color:orange' onclick="Add()"></i >

function Add(){
alert("call add function");
}

<i class='fa fa-plus-square fa-lg displaytooltip' id='idAdd'  title='' style = 'cursor:pointer;color:orange' onclick="Add()">YOUR ICON </i >