输入两个输入字段值时，javascript函数不起作用

Question

当我运行此命令并单击“提交”时，仅当我没有在表单中输入两个值时，它才起作用。 如果我仅输入一个字段或不输入任何数据，则它将按预期方式返回，但是当我同时输入城镇和电子邮件时，userText在屏幕上闪烁然后消失。 我想念什么？ 谢谢你的帮助....

    <html>

<form>
  <fieldset>
    <label>What's Your Home Town?
        <input type="text" id="town" size="40" maxlength="60" required>
    </label>    
    <label>Email Address?
        <input type="email" id="email" size="40" maxlength="60" required>
        </label>
    <label>Submit
    </label>
        <input type="submit" value="Submit" onclick="validateForm();">
  </fieldset>
        <p id = "text"></p>

</form>

<script>



        function validateForm() {
            var userTown = document.getElementById('town').value;
            var userEmail = document.getElementById('email').value;
            var userText = userTown +'\'s a Great Town!' + ' click this link to email someone who cares ' + userEmail;
            //alert(userText + ' Follow This Link to Send an Email to Someone who Cares ' + userEmail);
           document.getElementById('text').innerHTML=userText;    

        }

        </script>
</html>

Answer 1

由于您在表单中有一个submit类型按钮，因此可以提交表单。 将其更改为button类型将解决您的问题

 function validateForm() { var userTown = document.getElementById('town').value; var userEmail = document.getElementById('email').value; var userText = userTown + '\\'sa Great Town!' + ' click this link to email someone who cares <a href="mailto' + userEmail +'">' + userEmail +'</a>'; //alert(userText + ' Follow This Link to Send an Email to Someone who Cares ' + userEmail); document.getElementById('text').innerHTML = userText; }

 <form> <fieldset> <label>What's Your Home Town? <input type="text" id="town" size="40" maxlength="60" required> </label> <label>Email Address? <input type="email" id="email" size="40" maxlength="60" required> </label> <label>Submit </label> <input type="button" value="Submit" onclick="validateForm();"> </fieldset> <p id="text"></p> </form>

输入两个输入字段值时，javascript函数不起作用

问题描述

1 个解决方案

解决方案1
0 2018-02-05 18:26:13

输入两个输入字段值时，javascript函数不起作用

问题描述

1 个解决方案

解决方案1 0 2018-02-05 18:26:13

解决方案1
0 2018-02-05 18:26:13