【问题标题】:Select All Field Contents using InputMask jQuery Plugin使用 InputMask jQuery 插件选择所有字段内容
【发布时间】:2019-02-27 22:12:40
【问题描述】:

我正在使用 inputMask jQuery 插件,我想在字段成为焦点时选择该字段的全部内容。

这是我迄今为止尝试过的:

$('.numbers-only').inputmask("numeric", {
  radixPoint: ".",
  groupSeparator: ",",
  digits: 2,
  autoGroup: true,
  prefix: '',
  rightAlign: false,
  positionCaretOnClick: "select",
  oncleared: function () { self.Value(''); }
});

有人建议添加:

positionCaretOnClick: "select",

这不起作用。字段内容没有被选中。

我也试过这个:

$(document).on('click, focus', '.highlight-on-focus', function() {
    $(this).select();   
});

这也没有按预期工作。

相反,插入符号的位置只是转到字符串的末尾。

我该如何解决这个问题?

TIA,

布兰登

【问题讨论】:

    标签: jquery jquery-inputmask


    【解决方案1】:

    InputMask 的实例在输入上运行时,插件似乎处理事物焦点...不要问我什么!

    但似乎如果您的 setTimeout() 短至 1 毫秒,则 select() 可以工作。

    看看下面的链式.on() 方法。 ;)

    $(document).ready(function(){
      $('.numbers-only').inputmask("numeric", {
        radixPoint: ".",
        groupSeparator: ",",
        digits: 2,
        autoGroup: true,
        prefix: '',
        rightAlign: false,
        //positionCaretOnClick: "select",
        oncleared: function () { self.Value(''); }
      }).on("focus",function(){
        var that = $(this);
        setTimeout(function(){
          that.select();
        },1)
      });
    });
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/css/inputmask.css" rel="stylesheet"/>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/jquery.inputmask.bundle.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/inputmask.numeric.extensions.js"></script>
    
    <input class="numbers-only" value="2200.23">

    【讨论】:

    • 不客气...下次,请注意准确指出您使用的插件...您将获得更快的答案。 ;)
    【解决方案2】:

    只是对您编写的代码稍作改动,它应该是这样的:

    $(".numbers-only").focus(function(){
           $(this).select();
    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-04-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-12-26
      • 2012-03-26
      • 2019-08-07
      • 1970-01-01
      相关资源
      最近更新 更多