JQuery> Caret / Cursor не мигает, когда я возвращаю фокус на текстовое поле, используя размытие

Question

JQuery> Caret / Cursor не мигает, когда я возвращаю фокус на текстовое поле, используя размытие

0

У меня есть текстовое поле, которое должно принимать только числа. Я проверяю, что вводится в текстовое поле, используя метод JQuery onblur. Если проверка не удалась, я даю сообщение Alert Pop Up, чтобы сообщить пользователю, что есть проблема, и затем я программно возвращаю фокус в текстовое поле.

Моя проблема в том, что когда я возвращаю фокус в текстовое поле, курсор/каретка не мигает. Он есть, и я могу ввести текст в текстовое поле, не нажимая сначала его, чтобы выбрать его. Однако курсор не мигает, пока я на самом деле не нажму на текстовое поле. Я заметил, что курсор DOES мигает, если я не использую Alert Pop Up.

Я создал небольшую страницу html для иллюстрации. Http://jsfiddle.net/xB8Hy/2/ Вот код...

<html>
<head>
<script type="text/javascript" src="Plugins/jquery.js"></script>

<SCRIPT type="text/javascript">
$(document).ready(function() {

    $(document).on("blur","#qty_text", function() {
        var myregexp = /^[0]$|^[1-9][0-9]*$/;
            if( myregexp.test( $("#qty_text").val()) ){
                alert("Input Valid");
            }else{
                setTimeout(function(){
                    alert("Not a valid number");
                    $( "#qty_text" ).focus();
                }, 10);   
            }
    });

});
</script>
</head>

<body>
    <input type="text" id="qty_text">
</body>
</html>

Любые идеи о том, как я могу всплывать, но все еще получаю мигающий курсор в текстовом поле после того, как пользователь OKs из Alert Pop Up? Спасибо.

user1816113 22 янв. 2014, в 03:09

Источник

Теги:

jquery

textbox

focus

cursor

onblur

1 ответ

Ещё вопросы

user1816113 · Answer 1 · 2014-02-04T19-34-00.000Z

Ну, в случае, если кто-то заботится, я закончил использование модального диалогового плагина jQuery под названием SimpleModal. См. Здесь: http://www.ericmmartin.com/projects/simplemodal_v12/

Когда вы выходите из текстового поля, а тест проверки не выполняется, открывается диалоговое окно, и через несколько секунд он закрывается сам по себе, оставляя курсор (курсор, как вы его называете), заметно мерцая в текстовом поле. Успех.

Небольшой фрагмент кода:

<SCRIPT type="text/javascript">
$(document).ready(function() {
    $(document).on("blur","#qty_text", function() {
       var myregexp = /^[0]$|^[1-9][0-9]*$/;
        if( myregexp.test( $("#qty_text").val()) ){
            alert("Input Valid");
        }else{
            $('#simple-modal').modal({
                onOpen: function (dialog) {
                // If you use the onOpen callback, you must "show"
                // the overlay, data and container elements manually                    
                    dialog.overlay.fadeIn('slow');
                    dialog.container.fadeIn('slow');
                    dialog.data.fadeIn('slow');
                },
                onShow: function (dialog) {
                // Close the dialog automatically three seconds after it opens
                    setTimeout(function(){
                        dialog.data.hide();
                        dialog.container.hide();
                        dialog.overlay.fadeOut('slow', function () {
                            $.modal.close(); // must call this!
                            $( "#qty_text" ).focus();
                        });
                    }, 3000);
                }
          });
        }
    }); //<-- end of $(document).on("blur",..)
}); //<-- end of $(document).ready()
</script>

И вот тело с DIV, которое форматирует диалоговое окно:

<body>
<input type="text" id="qty_text">

<!-- The SimpleModal Dialog -->
    <div class="simple-modal" id="simple-modal">
       <div class="simple-modal-header">
         <h1>Quantity Error</h1>
       </div>
       <div class="simple-modal-body">
         <div class="contents">
           <p>Quantity Entered is not a Number</p>
           <p>Please Try Again</p>
         </div>
       </div>
      <div class="simple-modal-footer"></div>
    </div>
</body>

Я не знаю, почему в текстовом поле вы не получите мигающую карету после того, как вы вернете фокус на нее, когда нажата кнопка "ОК" в Javascript Alert Pop Up. Я все равно буду признателен, если кто-нибудь мне это объяснит.