JQuery UI Dialog: Password inputs causing freezing

问题

This is a odd behavior that seems to only happen in Chrome and with JQuery UI. When entering characters into a password field at first everything functions correctly. However, if you attempt to backspace to the last letter in the input, the browser locks up all client side operations. Also, if you try and highlight the characters entered and backspace the client side operations freeze.

Just reaching out to see if anyone has encountered this same issue, and how they resolved it.

In order to experience the issue, we have the dialog auto opening on 2+ unique page home views. Here is a listings page so it can be triggered, I apologize for the inconvenience but I can't remove the counter.

Page: http://www.christineleeteam.com/area/eagleharbor

回答1:

I had the same problem but cache clearing didn't help. I'm sure it isn't a jquery ui bug. Here is my solution:

   $('input[type="password"]').on('keydown', function(event){
     if (event.which == 8) { //backspace event
       event.preventDefault();
       $(this).val('');
     }
   });

This code is clearing the whole password field on one backspace event.

回答2:

We encountered the same issue, and used Benkod's solution. We improved it a little to also handle cases where the password text is deleted with the delete key (and not backspace). Another case is when all the text in the control is selected and new text is typed to replace it. Here is the script we used:

    Sys.Application.add_load(function() {
        $('input[type=password]').keydown(function(event) {

            var isAllTextSelected = this.value.slice(this.selectionStart, this.selectionEnd) == this.value;
            var isLastChar = $(this).val().length == 1;
            if (isAllTextSelected && $(this).val().length > 0) {
                $(this).val('');
            }
            if ((event.which == 8 || event.which == 46) && (isLastChar || isAllTextSelected)) { //backspace event

                event.preventDefault();
                $(this).val('');
            }
        });
    });

回答3:

Same problem here (FWIW, I'm using Twitter Bootstrap, but the issue was the same). It looks like it's caused by having a lot of content preceding the input. Placing the input higher--above the bulk of other content--did the trick for me. A work around, but better than nothing.

来源：https://stackoverflow.com/questions/14914361/jquery-ui-dialog-password-inputs-causing-freezing