Как открыть диалоговое окно загрузки файла при наведении на кнопку? - PullRequest
Новая
       2

Как открыть диалоговое окно загрузки файла при наведении на кнопку?

0 голосов
/ 19 октября 2018

Как открыть диалоговое окно файла при наведении курсора на кнопку загрузки с помощью jQuery of JavaScript?

Когда я делаю то же самое с нажатием кнопки загрузки, это работает.

Я хочу сделать это подумать о React.Есть ли какой-нибудь пакет npm для React?

Это код, который я пытаюсь сделать. 

<!DOCTYPE html>
<html>
    <head>
        <title>test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>

    <body>
        <input type="file" name="file" id="upload"/>
        <input type="button" id="Uplad_button" name="upload_file" value="upload" />

    </body>
</html>

<script type="text/javascript">
    $(document).ready(function(){
      $('#Uplad_button').hover(function(){
        console.log("hover")
        $('#upload').click();
      });
      $('#Uplad_button').click(function(){
        console.log("click")
        $('#upload').click();
      });
    });
</script>

1 Ответ

0 голосов
/ 19 октября 2018

jQuery имеет функцию с именем mouseenter().

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

<!DOCTYPE html>
<html>
    <head>
        <title>test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>

    <body>
        <input type="file" name="file" id="upload"/>
        <input type="button" id="Uplad_button" name="upload_file" value="upload" />
    </body>
</html>

<script type="text/javascript">
    $(document).ready(function(){
      $('#Uplad_button').mouseenter(function(){
        console.log("hover")
        $('#upload').click();
      });
      $('#Uplad_button').click(function(){
        console.log("click")
        $('#upload').click();
      });
    });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...