Question

当文本从中删除时，文本框会出现红色边框。但是，textarea不遵循此行为。有什么问题，如何解决？

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="ISO-8859-1" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scaleable=no" />

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

</head>

<body>
  <div data-role="page" id="page_1" data-theme="b">


    <div data-role="content" data-theme="b" style="padding:0px;margin:0;">
        <p>Content Page 1</p>
        <form name="contactForm" id="contactForm" data-ajax="false" method="post">
        <div>
            <input type="text" id="name" name="name" value="" required="true"></input>
        </div>
        <div>
            <input id="email" name="email" type="email" value="" required="true"></input>
        </div>
        <div>
        <textarea name="message" id="message" required="true"></textarea>
        </div>
        <div>
            <input type="submit" name="submit" id="submit" value="Submit"></input>
        </div>
 </form>
    </div>
 </div>

</body>
</html>

Answer 1

如果它不是JQuery Mobile的选项，您可能需要尝试以下方法：

$("#contactForm").submit(function (e) {
    e.preventDefault();
    if ($('#name')[0].checkValidity() === false) {
        $('#name')[0].toggleClass("error");
    }
}

在表单上捕获提交事件，停止提交并自行检查验证。如果无效，请添加错误类。

要求的textarea不会变红

1 个答案: