html Форма отправки с символом - PullRequest
0 голосов
/ 02 мая 2020

У меня проблема на моем сайте. Я хочу создать кнопку поиска с символом fontawesome (<i class="fas fa-search"></i>), но я не знаю, как заменить форму, отправленную этим символом, чтобы отправить форму.

<form id="searchForm">
  <div class="search-box">
    <input class="search-txt" type="text" name=""
        placeholder="Type to search" id="inputBox">
    <div class="search-btn">
      <input type="submit" value="Search">
      <i class="fas fa-search"></i>
    </div>
  </div>
</form>

С этим кодом будет отображаться кнопка Отправить и символ.

Надеюсь, вы поможете мне.

Ответы [ 3 ]

1 голос
/ 02 мая 2020

вы захотите использовать кнопку с type из submit:

<button type="submit" value="Search">
  <i class="fas fa-search"></i> 
</button>

Если атрибут type установлен на submit, он будет вести себя так же, как input type="submit".

0 голосов
/ 02 мая 2020

Помогает ли это?

<!DOCTYPE html>
<html>
<head>
<title>Font Awesome Icons</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>

<form id="searchForm">
  <div class="search-box">
    <input class="search-txt" type="text" name="" placeholder="Type to search" id="inputBox">
    <div class="search-btn">
      <button onclick="this.form.submit()"><i class="fa fa-align-center fa-save"> Submit</i></button>
    </div>
  </div>
</form>

</body>
</html> 
0 голосов
/ 02 мая 2020

Вы можете заменить тип ввода ввода кнопкой.

<button type="submit">
   <i class="fas fa-search"></i>
</button>

Настройте стили кнопки в соответствии с вашим дизайном.

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