Question

我们在只读文本框上有一个JQuery日期选择器控件。我们将文本框设为只读，以便用户无法输入自己的日期。这很好用但我们希望为用户提供在选择日期后清除文本框内容的选项。

你怎么能这样做？显然，这个功能曾经内置到控件中，但是removed。

注意：我们使用以下方法禁用文本框中的输入：

$("#text-box").keypress(function (e)
{
    e.preventDefault();
});

更新：我通过选择答案的略微变化解决了这个问题：

    myTextBox.keydown(function(e){
        if (e.keyCode == 46 || e.keyCode == 8) {
            //Delete and backspace clear text 
            $(this).val(''); //Clear text
            $(this).datepicker("hide"); //Hide the datepicker calendar if displayed
            $(this).blur(); //aka "unfocus"
        }

        //Prevent user from manually entering in a date - have to use the datepicker box
        e.preventDefault();
    });

Answer 1

排除用户用来清除“del”，“退格”等文本框的keys怎么样？

$("#text-box").keypress(function (e)
{
  switch(e.keyCode) { 
          case 46:  // delete
          case 8:  // backspace
            break;
          default:
            e.preventDefault();
            break;
       }
});

Answer 2

$("#text-box").bind('keypress keydown', function (e) {
  var tag = e.target.tagName;
  if (e.which === 8 || e.which === 46) { 
    $(this).val(''); 
    $(this).datepicker("hide"); 
    $(this).blur(); 
    e.stopPropagation();
    e.preventDefault();
    return false;
  }
});

这适用于don't trigger keypress events for "delete" keys。

的浏览器

如何清除只读的jQuery日期选择器文本框？

2 个答案: