Не удается обнаружить щелчок в родительском элементе от дочернего элемента - PullRequest
Новая
       5

Не удается обнаружить щелчок в родительском элементе от дочернего элемента

0 голосов
/ 30 октября 2019

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

Проблема в том, что когда я использую @onfocusous, он работает, только если я нажимаю в строке, новне выпадающего списка. Я хочу иметь возможность щелкнуть в любом месте страницы, которая не является раскрывающимся, для переключения назад.

Вот HTML-код, который у меня есть. 

<td class="@(isDropdown == true ? "hide" : "")" @onclick="BeginEdit">
    This is a test
</td>
<td class="@(isDropdown == true ? "" : "hide")" 
@onfocusout="StopEdit" id="dropdown" @onfocusout="StopEdit">
    <div class="input-group input-group-sm mb-3">
        <BlazoredTypeahead SearchMethod="search.blah"
                            @bind-Value="@variable"
                            EnableDropDown="true"
                            Debounce="500">
            <SelectedTemplate Context="ctx">
                 @ctx
            </SelectedTemplate>
            <ResultTemplate Context="ctx">
                @ctx
            </ResultTemplate>
        </BlazoredTypeahead>
     </div>
</td>

Я предполагаю, что мне нужен javascript длясделайте это, но я никогда не использовал javascript и не знаю, как использовать взаимодействие, поэтому любая помощь будет полезна.

1 Ответ

0 голосов
/ 31 октября 2019

Для того, чтобы элемент td потерял фокус, сначала нужно установить его фокус. Это достигается установкой атрибута tabindex на «0»;

Попробуйте этот код: 

<td class="@(isDropdown == true ? "" : "hide")" 
@onfocusout="StopEdit" id="dropdown"  tabindex="0">

Надеюсь, это поможет ...

...