Не удалось выполнить совпадения для элемента: недопустимый селектор - PullRequest
0 голосов
/ 28 ноября 2018

Некоторое время назад я написал следующий код для отображения определенных элементов на моей html-странице:

<div id="gameField">
@foreach (var item in Model.Characters)
{
    <div class="char" id="@item.Id"  onclick="ShowDropDown(event,this.id)">
        <img src="~/Content/Images/Characters/@item.ImageSource" class="character" alt="Character" />
        <img src="~/Content/Images/Cross.png" class="cross" alt="Cross" />
        <p>@item.Name</p>
    </div>
}
<div id="myDropdown" class="dropdown-content">
    <a href="#" onclick="Flip()">Flip</a>
    <a href="#" onclick="Highlight()">Highlight</a>
    <a href="#" id="Guess" >Guess</a>
    <a href="#" class="red" onclick="Hide()">Hide</a>
</div>

идентификатор - это число от 0 до 24.

со следующим кодом JavaScript:

function ShowDropDown(event, clicked_id) {
        var Dropdown = document.getElementById("myDropdown");
        var x = event.clientX;
        var y = event.clientY;
        id = clicked_id;
        Dropdown.style.top = (y + 10) + 'px';
        Dropdown.style.left = (x + 10) + 'px';
        Dropdown.classList.toggle("show");
}

window.onclick = function (event) {
if (!event.target.matches(id)) {

    var dropdowns = document.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
        var openDropdown = dropdowns[i];
        if (openDropdown.classList.contains('show')) {
            openDropdown.classList.remove('show');
        }
    }
}
}

Теперь каждый раз, когда я нажимаю на элемент, в консоли появляется следующее сообщение об ошибке:

Uncaught DOMException: Не удалось выполнить «совпадения» для «элемента»: «13» не является допустимым селектором.at window.onclick (http://localhost:58203/Game?newgame=True&gameId=0&mode=2:131:31) window.onclick @ Game? newgame = True & gameId = 0 & mode = 2: 131

, где меняется 13 ходов, когда я нажимаю на другой элемент., код работает, но это сообщение об ошибке по-прежнему отображается в консоли, я также пытался поместить символ перед идентификатором, но сообщение об ошибке по-прежнему отображается

1 Ответ

0 голосов
/ 28 ноября 2018

.matches(selector) должен получить селектор CSS, поэтому вы должны добавить # перед идентификатором:

if (!event.target.matches('#' + id)) {

Но идентификатор не может быть просто числом, так что вы бытакже необходимо добавить символ перед номером идентификатора, чтобы он работал правильно.

Подробнее: https://developer.mozilla.org/en-US/docs/Web/API/Element/matches

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...