rock_ing 2022-11-02 22:52 采纳率: 0%
浏览 35

Html input中表单提示required，怎么把Email格式错误的提示信息改成英文的？我只做到了不输入Email时用英文提示

Html input中表单提示required，怎么把Email格式错误的提示信息改成英文的？我只做到了不输入Email时用英文提示


   <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Registration page</title>

    <link rel="stylesheet" href="style1.css">
    <link rel="shortcut icon" href="./icon/logo.png">
</head>
<body>
<!--头部-->
<div id="reg_header">
    <div class="reg_h_center">
        <div class="reg_h_left">
            <img src="./icon/logo.png" alt="">
            <h3>Welcome to register!</h3>
        </div>
    </div>
</div>


<!--表单内容-->
<div class="reg_back">
    <div class="reg_left">
        <p>Regisration</p>
        <p>USER REGISTER</p>
    </div>
    <div class="reg_center">
        <div class="reg_form">
            <form name="registrationForm"action="#" method="post">
                <table>
                    <tr>
                        <td class="td_left"><label for="username">Username:</label></td>
                        <td class="td_right"><input type="text" name="username" id="username" required oninvalid="setCustomValidity('Please enter your message!');" oninput="setCustomValidity('');"></td>
                    </tr>
                   
                    <tr>
                        <td class="td_left"><label for="Email">Email:</label></td>
                        <td class="td_right"><input type="email" name="email" id="Email" required oninvalid="setCustomValidity('Please enter your email!');" oninput="setCustomValidity('');" ></td>
                    </tr>

                    <tr>
                        <td class="td_left"><label for="password">Password:</label></td>
                        <td class="td_right"><input type="password" name="password" id="password" required oninvalid="setCustomValidity('Please enter your password!');" oninput="setCustomValidity('');"></td>
                    </tr>

                    <tr>
                        <td class="td_left"><label for="Confirm_Password">Confirm Password:</label></td>
                        <td class="td_right"><input type="password" name="Confirm_Password" id="Confirm_Password" required oninvalid="setCustomValidity('Please enter your confirm password!');" oninput="setCustomValidity('');">
                        </td>
                    </tr>
                    
                    <tr>
                        <td colspan="2" align="center"><input type="submit" value="register" id="btn_sub"></td>
                    </tr>
                </table>
            </form>
        </div>
    </div>
    <div class="reg_right">
        <p>Have already login?<a href="login.html">Log in now</a></p>
    </div>
</div>
</body>
</html>

img

img

  • 写回答

1条回答 默认 最新

  • 爱新觉罗·苟子 2022-11-03 10:19
    关注

    1 引入elementUI

    <!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

    2 配置语言包

    <script src="//unpkg.com/element-ui/lib/umd/locale/en.js"></script>

<script>
  ELEMENT.locale(ELEMENT.lang.en)
</script>

    3 使用组件

     <el-form-item
    prop="email"
    label="邮箱"
    :rules="[
      { required: true, message: '请输入邮箱地址', trigger: 'blur' },
      { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
    ]"
  >
    <el-input v-model="dynamicValidateForm.email"></el-input>
  </el-form-item>
    评论

报告相同问题？

问题事件

  • 修改了问题 11月2日
  • 创建了问题 11月2日