2009-01-26 40 views
10

这是一个后续问题这个问题:jQuery蒙面输入插件。选择所有内容,当文本框获得焦点

select all contents of textbox when it receives focus (Javascript or jQuery)

基本上我与jQuery masked input plugin结合使用文本框(编辑:链接可能在相关版本不再指向)

当蒙面输入文本框收到焦点时,我想选择该文本框的所有内容,但好像将此插件绑定到文本框可以防止这种情况。我只是想知道是否有办法解决这个问题。

以下是一个演示这一问题的样品的.html页面:

<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <input id="masktest" type="text" value="01/01/2009" /> 
    <br /> 
    <input id="focustest" type="text" value="on focus will select all contents..." /> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
    <script type="text/javascript" src="http://jquery-joshbush.googlecode.com/files/jquery.maskedinput-1.2.1.pack.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $("#masktest").mask("99/99/9999"); 

      // Contents of textboxes will be selected when receiving focus. 
      $("input[type=text]") 
       .focus(function() { 
        $(this).select(); 
       }); 
     }); 
    </script> 
</body> 
</html> 

回答

7

我是用于jQuery的Masked Input Plugin的作者。我决定这应该是完成蒙版的默认行为,并将其纳入最新版本。你可以阅读细节here

3

嘿乔恩,不要太肯定的表现,为此,但这应该工作:

$(function() { 


     // Contents of textboxes will be selected when receiving focus. 
     $("input[type=text]") 
      .focus(function() { 
       var mask = "99/99/9999"; 
       $(this).unmask(mask).select().mask(mask); 
      }); 
    }); 
3

其工作我在FF3。

$("input[type=text]").focus(function(e) { 
    var that = this; 
    setTimeout(function(){$(that).select();},10); 
    return false; 
}); 

的setTimeout将“排队”的select()的执行,我想知道: - 好面具的功能做你的工作,那么我会选择内容。那就是队列的用处。

只是一个想法。我希望它按预期工作。

+0

它的工作原理(在IE7以及)!也很方便知道,我可以看到这可能会在可能发生的其他类似情况下有用。 – 2009-01-26 21:23:08

+0

我不能让这个解决方案与setTimeout ...一起工作,但通过做$(“body”)。animate({opacity:1.0},10,function(){$(that).select();});它工作正常 – Birk 2009-02-19 20:31:00

1

问题

Defaut值被删除时,焦点

解析:增加了小的补丁代码mask.js文件(jquery.maskedinput-1.2.2 .min.js)

(function(a){var c=(a.browser.msie?"paste":"input")+".mask";var b=(window.orientation!=undefined);a.mask={definitions:{"9":"[0-9]",a:"[A-Za-z]","*":"[A-Za-z0-9]"}};a.fn.extend({caret:function(e,f){if(this.length==0){return}if(typeof e=="number"){f=(typeof f=="number")?f:e;return this.each(function(){if(this.setSelectionRange){this.focus();this.setSelectionRange(e,f)}else{if(this.createTextRange){var g=this.createTextRange();g.collapse(true);g.moveEnd("character",f);g.moveStart("character",e);g.select()}}})}else{if(this[0].setSelectionRange){e=this[0].selectionStart;f=this[0].selectionEnd}else{if(document.selection&&document.selection.createRange){var d=document.selection.createRange();e=0-d.duplicate().moveStart("character",-100000);f=e+d.text.length}}return{begin:e,end:f}}},unmask:function(){return this.trigger("unmask")},mask:function(j,d){if(!j&&this.length>0){var f=a(this[0]);var g=f.data("tests");return a.map(f.data("buffer"),function(l,m){return g[m]?l:null}).join("")}d=a.extend({placeholder:"_",completed:null},d);var k=a.mask.definitions;var g=[];var e=j.length;var i=null;var h=j.length;a.each(j.split(""),function(m,l){if(l=="?"){h--;e=m}else{if(k[l]){g.push(new RegExp(k[l]));if(i==null){i=g.length-1}}else{g.push(null)}}});return this.each(function(){var ORJ=$(this).val();var r=a(this);var m=a.map(j.split(""),function(x,y){if(x!="?"){return k[x]?d.placeholder:x}});var n=false;var q=r.val();r.data("buffer",m).data("tests",g);function v(x){while(++x<=h&&!g[x]){}return x}function t(x){while(!g[x]&&--x>=0){}for(var y=x;y<h;y++){if(g[y]){m[y]=d.placeholder;var z=v(y);if(z<h&&g[y].test(m[z])){m[y]=m[z]}else{break}}}s();r.caret(Math.max(i,x))}function u(y){for(var A=y,z=d.placeholder;A<h;A++){if(g[A]){var B=v(A);var x=m[A];m[A]=z;if(B<h&&g[B].test(x)){z=x}else{break}}}}function l(y){var x=a(this).caret();var z=y.keyCode;n=(z<16||(z>16&&z<32)||(z>32&&z<41));if((x.begin-x.end)!=0&&(!n||z==8||z==46)){w(x.begin,x.end)}if(z==8||z==46||(b&&z==127)){t(x.begin+(z==46?0:-1));return false}else{if(z==27){r.val(q);r.caret(0,p());return false}}}function o(B){if(n){n=false;return(B.keyCode==8)?false:null}B=B||window.event;var C=B.charCode||B.keyCode||B.which;var z=a(this).caret();if(B.ctrlKey||B.altKey||B.metaKey){return true}else{if((C>=32&&C<=125)||C>186){var x=v(z.begin-1);if(x<h){var A=String.fromCharCode(C);if(g[x].test(A)){u(x);m[x]=A;s();var y=v(x);a(this).caret(y);if(d.completed&&y==h){d.completed.call(r)}}}}}return false}function w(x,y){for(var z=x;z<y&&z<h;z++){if(g[z]){m[z]=d.placeholder}}}function s(){return r.val(m.join("")).val()}function p(y){var z=r.val();var C=-1;for(var B=0,x=0;B<h;B++){if(g[B]){m[B]=d.placeholder;while(x++<z.length){var A=z.charAt(x-1);if(g[B].test(A)){m[B]=A;C=B;break}}if(x>z.length){break}}else{if(m[B]==z[x]&&B!=e){x++;C=B}}}if(!y&&C+1<e){r.val(ORJ);w(ORJ.length,h)}else{if(y||C+1>=e){s();if(!y){r.val(r.val().substring(0,C+1))}}}return(e?B:i)}if(!r.attr("readonly")){r.one("unmask",function(){r.unbind(".mask").removeData("buffer").removeData("tests")}).bind("focus.mask",function(){q=r.val();var x=p();s();setTimeout(function(){if(x==j.length){r.caret(0,x)}else{r.caret(x)}},0)}).bind("blur.mask",function(){p();if(r.val()!=q){r.change()}}).bind("keydown.mask",l).bind("keypress.mask",o).bind(c,function(){setTimeout(function(){r.caret(p(true))},0)})}p()})}})})(jQuery); 
0

如果你的 '已完成' 功能不工作,试图取代这一行:当使用此

if (settings.completed && eval(+next - 1) == len)

if (settings.completed && next == len)

(这是未压缩插件的行号169)与插件与萤火虫,我注意到,当输入最后一个字符掩码时,'next'变量会跳过符号。 这种方式应该工作。

0

我发现比超时更好的解决方案。

您可以查看jquery.maskedinput。JS:293有输入对焦的功能,它是只触发输入上没有“只读”属性,那么:

$("input[type=text]").attr("readonly", true).select().removeAttr("readonly");

...就这样。工程就像一个魅力;)

相关问题