jquery模糊不工作/触发

时间:2016-05-05 10:34:07

标签: javascript jquery

我对jquery和javascript了解不多。这是我的输入文本代码,我想使用模糊来验证字段

  <div class="form-row form-input-name-row" >

                <label>
                    <span>Full name</span>
                    <input id="txt_name" type="text" name="name">
                </label>

                <!--
                    Add these three elements to every form row. They will be shown by the
                    .form-valid-data and .form-invalid-data classes (see the JS for an example).
                -->

                <span class="form-valid-data-sign"><i class="fa fa-check"></i></span>

                <span class="form-invalid-data-sign"><i class="fa fa-close"></i></span>
                <span class="form-invalid-data-info"></span>

            </div>  

这是我的javascript代码,其中我添加了模糊功能

<script type="text/javascript">


    $(document).ready(function() {

        // Here is how to show an error message next to a form field
 $("#txt_name").blur(function() {

        var errorField = $('.form-input-name-row');

        // Adding the form-invalid-data class will show
        // the error message and the red x for that field

        errorField.addClass('form-invalid-data');
        errorField.find('.form-invalid-data-info').text('Please enter your name');

});​
        // Here is how to mark a field with a green check mark

        var successField = $('.form-input-email-row');

        successField.addClass('form-valid-data');



    });
     $(".clicker").click(function(){
    $(".file").click();
});



function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $('#blah').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}



</script>  

我也在使用bootstrap,有人可以告诉为什么模糊不会被解雇吗?

3 个答案:

答案 0 :(得分:0)

04 2F FF 01 AC A2 65 92 88 EC 01 00 0C 02 5A 2D 1F D2 08 09 4E 65 78 75 73 20 36 17 03 05 11 0A 11 0C 11 0E 11 12 11 15 11 16 11 1F 11 2F 11 00 12 32 11 01 05 01 07 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 事件正在被解雇。这是您在模糊回调中使用blur的代码。

PS。快速说明一下。当您alert()然后“关注”时会触发blur

focus
$(document).ready(function() {

  // Here is how to show an error message next to a form field
  $("#txt_name").blur(function() {
    
    alert('Blur event fired!');                        // < === HERE ===

    var errorField = $('.form-input-name-row');

    // Adding the form-invalid-data class will show
    // the error message and the red x for that field

    errorField.addClass('form-invalid-data');
    errorField.find('.form-invalid-data-info').text('Please enter your name');

  });
  // Here is how to mark a field with a green check mark

  var successField = $('.form-input-email-row');

  successField.addClass('form-valid-data');
});

$(".clicker").click(function() {
  $(".file").click();
});

function readURL(input) {
  if (input.files && input.files[0]) {
    var reader = new FileReader();
    reader.onload = function(e) {
      $('#blah').attr('src', e.target.result);
    }

    reader.readAsDataURL(input.files[0]);
  }
}

答案 1 :(得分:0)

 errorField.addClass('form-invalid-data');
        errorField.find('.form-invalid-data-info').text('Please enter your name');

});​

尝试使用此代码,希望它能够正常工作,省略分号“;”

 errorField.addClass('form-invalid-data');
        errorField.find('.form-invalid-data-info').text('Please enter your name');

})

答案 2 :(得分:0)

https://jsfiddle.net/ra3bbtow/

});​ // Here is how to mark a field with a green check mark

有一个红点,这是一个没有在我的想法中显示的角色。谢谢 @MedetAhmetsonAtabayev