HTML кнопка отправки формы не работает в мобильных телефонах

Question

Я сделал HTML форму, и она отлично работает на моем ноутбуке. Но ничего не происходит при нажатии кнопки «Отправить», когда я использую ее в своем мобильном телефоне.

Вот мой HTML Код:

<div class="form">
                <form action="mailto:anubhavmadhav20@gmail.com?subject=MessageFromWebsite" method="post" enctype="text/plain" id="myform">
                    <label>Name:</label>
                    <input type="text" name="yourName"><br>
                    <label>Email:</label>
                    <input type="email" name="yourEmail"><br>
                    <label>Message:</label><br>
                    <textarea rows="10" cols="30" name="yourMessage"></textarea><br>
                    <button type="submit" class="button" method="post" enctype="text/plain"><span>Submit</span></button>

                </form>
            </div>

Answer 1

Вам нужно действие в форме, а не в кнопке

Если на мобильном телефоне нет функции mailto, вам потребуется сервер для отправки почты

Но форма должна больше похоже на это

<div class="form">
  <form action="mailto:...@gmail.com?subject=MessageFromWebsite" method="post" enctype="text/plain" id="myform" target="_blank">
    <label>Name:</label>
    <input type="text" name="yourName"><br>
    <label>Email:</label>
    <input type="email" name="yourEmail"><br>
    <label>Message:</label><br>
    <textarea rows="10" cols="30" name="yourMessage"></textarea><br>
    <button type="submit" class="button"><span>Submit</span></button>
  </form>
</div>

Попробуйте вместо ссылки - работает в Chrome для iOS для одного:

https://plungjan.name/SO/mailtotest.html

window.addEventListener("load", function() {
  document.getElementById("mailtolink").addEventListener("click", function(e) {
    e.preventDefault() // remove after testing
    let url = new URL(this.href);
    const name = document.querySelector("[name=yourName]").value.trim();
    const email = document.querySelector("[name=yourEmail]").value.trim();
    const message = document.querySelector("[name=yourMessage]").value.trim();
    url.searchParams.set("from", email);
    url.searchParams.set("subject", "Message from " + (document.title || location.hostname))
    url.searchParams.set("body", name + " said " + message)
    this.href=url;
    console.log(url)
  })
});

.button {
  font: bold 11px Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

<div class="form">
  <form>
    <label>Name:</label>
    <input type="text" name="yourName"><br>
    <label>Email:</label>
    <input type="email" name="yourEmail"><br>
    <label>Message:</label><br>
    <textarea rows="10" cols="30" name="yourMessage"></textarea><br>
    <a target="_blank" class="button"  href="mailto:...@gmail.com" id="mailtolink"><span>Submit</span></a>
  </form>
</div>

Answer 2

mailto-property отправляет электронное письмо от установленной на вашем устройстве почтовой программы, если оно установлено по умолчанию на вашей ОС.

Как сказано здесь: http://www.tutorialspark.com/html5/HTML5_email_mailto.php

2. При нажатии ссылки mailto открывается пользовательская программа электронной почты или программа по умолчанию.

Это означает, что вам нужна программа электронной почты по умолчанию, или она не будет работать.

Может быть, у вас не установлена ​​программа электронной почты на вашем мобильном телефоне?

Рассмотрите возможность отправки писем с сервера apache, используя php.