Question

如果点击忘记按钮电子邮件字段应该使用javascript验证，我完成了一个代码，但它不起作用，许多脚本标签是有用的，请建议我。

脚本

JS / testing.js＆＃34;＆GT;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>



<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
 Did you omit follow library? 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
  <script>
    $(document).ready(function() {
      $("#form1").validate({
        rules: {
          email: "required"
        },
        messages: {
          email: "Please specify your name"

        }
      }) 
      $('#btn-show-forgot').on('click', function() {
        $("#form1").valid();
      });

    });
  </script>

形式

 <form id="form1" name="form1" action="<?php echo base_url(); ?>Index.php/Login_cntrl/login" method="POST" >

                        <div class="field-wrap">
                            <label class="view-label">Email Address</label>
                            <input type="email" placeholder="Email Address" name="email" id="email" class="input-control inputstyle" value="<?php echo set_value('email'); ?>"/>
                            <span class="text-danger"><?php echo form_error('email'); ?></span>
                        </div>
                        <!--<div id='errorDiv' class='col-xs-12 pull-right'> </div>-->
                        <div class="field-wrap">
                            <input type="password" placeholder="Password" class="inputstyle" name="password" id="password" value="<?php echo set_value('password'); ?>"/>
                            <span class="text-danger"><?php echo form_error('password'); ?></span>

                            <a href="javascript:void(0)" class="btn btn-link btn-nobg" id="btn-show-forgot" >Forgot ?</a>  

                        </div>

                        <!--<div id='errorDivv' class='col-xs-12 pull-right'> </div>-->
                        <div class="field-wrap">
                            <button type="submit" class="btn btn-submit" name="ulogin" id="ulogin" value="ulogin" >Login</button>
                            <?php
                            if (isset($message)) {
                                echo $message;
                            }
                            ?>
                        </div>
                        <div class="field-wrap">
                            <a href="javascript:void(0)" class="btn btn-link btn-nobg" id="btn-show-signup">NEW User? Sign up</a>

                        </div>

                    </form>

Answer 1

修改过的脚本

<script>
var validateEmail = function(elementValue) {
    var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
    return emailPattern.test(elementValue);
}

$('#btn-show-forgot').click(function() {
    var value = $('#email').val();
    var valid = validateEmail(value);
    if (!valid) {
        alert("Please enter a valid email");        
        return false;
    }
});

$('#email').keyup(function() {

    var value = $(this).val();
    var valid = validateEmail(value);

    if (!valid) {
        $(this).css('color', 'red');
    } else {
        $(this).css('color', '#000');
    }

});
</script>

单击忘记按钮（href链接）电子邮件字段应使用javascript验证

1 个答案: