Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.09.2018, 13:21
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

Появление скрытого div
Нужна Ваша помощь. Помогите пожалуйста.


Мой код. нужно сделать чтоб при введении 16 цифр в поле Input появлялся скрытый div если в input не введено 16 цифр div будет скрыт. Как это реализовать? помогите пожалуйста специалисты .

<input id="phone"  placeholder="Введите 16 цифр" type="text" class="form-control">
                           


                           <script>
                              jQuery (function ($) {  
                                $(function() {
                                  function maskPhone() {
                                    var country = $('#country option:selected').val();
                                    switch (country) {
                                      case "ru":
                                        $("#phone").mask("9999 9999 9999 9999");
                                        break;
                                    }    
                                  }
                                  maskPhone();
                                  $('#country').change(function() {
                                    maskPhone();
                                  });
                                });
                              });
                           </script>



<div>
       Появление DIV (скрытый )
          </div>
Ответить с цитированием
  #2 (permalink)  
Старый 05.09.2018, 15:48
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

kseosru,
Если вы используете jquery-maskedinput, то там можно назначать функцию, которая вызывается после заполнения маски
Цитата:
Optionally, if you would like to execute a function once the mask has been completed, you can specify that function as an optional argument to the maskedinput method.

jQuery(function($){
$("#product").mask("99/99/9999",{completed:function(){alert("You typed the following: "+this.val());}});
});
Ответить с цитированием
  #3 (permalink)  
Старый 05.09.2018, 15:57
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

Я новичок и не совсем разбираюсь еще в коде. Этот код нашел в интернете подскажите как это все собрать вместе можно даже без 16 цифр а просто если заполненное поле input тогда появляется скрытый div ?
Ответить с цитированием
  #4 (permalink)  
Старый 05.09.2018, 16:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

kseosru,
какой плагин маски?
Ответить с цитированием
  #5 (permalink)  
Старый 05.09.2018, 16:39
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

№1


eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('!2(a){"2"==Z 1b&&1b.2u?1b(["1H"],a):a("2l"==Z 2j?2h("1H"):2f)}(2($){q m,R=2e.2d,1t=/2c/i.x(R),1i=/1i/i.x(R),T=/T/i.x(R);$.7={1y:{"9":"[0-9]",a:"[A-1l-z]","*":"[A-1l-23-9]"},U:!0,V:"22",K:"21"},$.1B.1D({v:2(a,b){q c;6(0!==o.u&&!o.20(":1Z"))y"1x"==Z a?(b="1x"==Z b?b:a,o.1f(2(){o.16?o.16(a,b):o.1A&&(c=o.1A(),c.1X(!0),c.1W("19",b),c.1E("19",a),c.1V())})):(o[0].16?(a=o[0].1U,b=o[0].1T):X.1k&&X.1k.1m&&(c=X.1k.1m(),a=0-c.1S().1E("19",-1R),b=a+c.1Q.u),{4:a,r:b})},Q:2(){y o.1v("Q")},7:2(f,g){q h,L,5,G,D,Y,s,M;6(!f&&o.u>0){h=$(o[0]);q l=h.1K($.7.V);y l?l():1J 0}y g=$.1D({U:$.7.U,K:$.7.K,17:O},g),L=$.7.1y,5=[],G=s=f.u,D=O,$.1f(f.1n(""),2(i,c){"?"==c?(s--,G=i):L[c]?(5.1o(1O 1N(L[c])),O===D&&(D=5.u-1),G>i&&(Y=5.u-1)):5.1o(O)}),o.1v("Q").1f(2(){2 12(){6(g.17){B(q i=D;Y>=i;i++)6(5[i]&&n[i]===F(i))y;g.17.1w(d)}}2 F(i){y g.K.1c(i<g.K.u?i:0)}2 E(a){B(;++a<s&&!5[a];);y a}2 1z(a){B(;--a>=0&&!5[a];);y a}2 1e(a,b){q i,j;6(!(0>a)){B(i=a,j=E(b);s>i;i++)6(5[i]){6(!(s>j&&5[i].x(n[j])))14;n[i]=n[j],n[j]=F(j),j=E(j)}H(),d.v(28.1M(D,a))}}2 1G(a){q i,c,j,t;B(i=a,c=F(a);s>i;i++)6(5[i]){6(j=E(i),t=n[i],n[i]=c,!(s>j&&5[j].x(t)))14;c=t}}2 1I(){q a=d.w(),3=d.v();6(M&&M.u&&M.u>a.u){B(C(!0);3.4>0&&!5[3.4-1];)3.4--;6(0===3.4)B(;3.4<D&&!5[3.4];)3.4++;d.v(3.4,3.4)}1h{B(C(!0);3.4<s&&!5[3.4];)3.4++;d.v(3.4,3.4)}12()}2 1d(){C(),d.w()!=15&&d.1P()}2 1r(e){6(!d.11("W")){q a,4,r,k=e.1F||e.1C;M=d.w(),8===k||1a===k||1t&&1Y===k?(a=d.v(),4=a.4,r=a.r,r-4===0&&(4=1a!==k?1z(4):r=E(4-1),r=1a===k?E(r):r),N(4,r),1e(4,r-1),e.1g()):13===k?1d.1w(o,e):27===k&&(d.w(15),d.v(0,C()),e.1g())}}2 1u(e){6(!d.11("W")){q p,c,S,k=e.1F||e.1C,3=d.v();6(!(e.24||e.25||e.26||1L>k)&&k&&13!==k){6(3.r-3.4!==0&&(N(3.4,3.r),1e(3.4,3.r-1)),p=E(3.4-1),s>p&&(c=29.2a(k),5[p].x(c))){6(1G(p),n[p]=c,H(),S=E(p),T){q a=2(){$.2b($.1B.v,d,S)()};1j(a,0)}1h d.v(S);3.4<=Y&&12()}e.1g()}}}2 N(a,b){q i;B(i=a;b>i&&s>i;i++)5[i]&&(n[i]=F(i))}2 H(){d.w(n.P(""))}2 C(a){q i,c,3,x=d.w(),J=-1;B(i=0,3=0;s>i;i++)6(5[i]){B(n[i]=F(i);3++<x.u;)6(c=x.1c(3-1),5[i].x(c)){n[i]=c,J=i;14}6(3>x.u){N(i+1,s);14}}1h n[i]===x.1c(3)&&3++,G>i&&(J=i);y a?H():G>J+1?g.U||n.P("")===1s?(d.w()&&d.w(""),N(0,s)):H():(H(),d.w(d.w().2g(0,J+1))),G?i:D}q d=$(o),n=$.1q(f.1n(""),2(c,i){y"?"!=c?L[c]?F(i):c:1J 0}),1s=n.P(""),15=d.w();d.1K($.7.V,2(){y $.1q(n,2(c,i){y 5[i]&&c!=F(i)?c:O}).P("")}),d.2i("Q",2(){d.1p(".7").2k($.7.V)}).I("2m.7",2(){6(!d.11("W")){2n(m);q a;15=d.w(),a=C(),m=1j(2(){d.2o(0)===X.2p&&(H(),a==f.2q("?","").u?d.v(0,a):d.v(a))},10)}}).I("2r.7",1d).I("2s.7",1r).I("2t.7",1u).I("18.7 2v.7",2(){d.11("W")||1j(2(){q a=C(!0);d.v(a),12()},0)}),1i&&T&&d.1p("18.7").I("18.7",1I),C()})}})});',62,156,'||function|pos|begin|tests|if|mask||||||||||||||||buffer|this||var|end|len||length|caret|val|test|return|||for|checkVal|firstNonMaskPos|seekNext|getPlaceholder|partialPosition|writeBuffer|on|lastMatch|placeholder|defs|oldVal|clearBuffer|null|join|unmask|ua|next|android|autoclear|dataName|readonly|document|lastRequiredNonMaskPos|typeof||prop|tryFireCompleted||break|focusText|setSelectionRange|completed|input|character|46|define|charAt|blurEvent|shiftL|each|preventDefault|else|chrome|setTimeout|selection|Za|createRange|split|push|off|map|keydownEvent|defaultBuffer|iPhone|keypressEvent|trigger|call|number|definitions|seekPrev|createTextRange|fn|keyCode|extend|moveStart|which|shiftR|jquery|androidInputEvent|void|data|32|max|RegExp|new|change|text|1e5|duplicate|selectionEnd|selectionStart|select|moveEnd|collapse|127|hidden|is|_|rawMaskFn|z0|ctrlKey|altKey|metaKey||Math|String|fromCharCode|proxy|iphone|userAgent|navigator|jQuery|substring|require|one|exports|removeData|object|focus|clearTimeout|get|activeElement|replace|blur|keydown|keypress|amd|paste'.split('|'),0,{}))


№2

/*
    jQuery Masked Input Plugin
    Copyright (c) 2007 - 2015 Josh Bush (digitalbush.com)
    Licensed under the MIT license ([url]http://digitalbush.com/projects/masked-input-plugin/#license[/url])
    Version: 1.4.1
*/
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):a("object"==typeof exports?require("jquery"):jQuery)}(function(a){var b,c=navigator.userAgent,d=/iphone/i.test(c),e=/chrome/i.test(c),f=/android/i.test(c);a.mask={definitions:{9:"[0-9]",a:"[A-Za-z]","*":"[A-Za-z0-9]"},autoclear:!0,dataName:"rawMaskFn",placeholder:"_"},a.fn.extend({caret:function(a,b){var c;if(0!==this.length&&!this.is(":hidden"))return"number"==typeof a?(b="number"==typeof b?b:a,this.each(function(){this.setSelectionRange?this.setSelectionRange(a,b):this.createTextRange&&(c=this.createTextRange(),c.collapse(!0),c.moveEnd("character",b),c.moveStart("character",a),c.select())})):(this[0].setSelectionRange?(a=this[0].selectionStart,b=this[0].selectionEnd):document.selection&&document.selection.createRange&&(c=document.selection.createRange(),a=0-c.duplicate().moveStart("character",-1e5),b=a+c.text.length),{begin:a,end:b})},unmask:function(){return this.trigger("unmask")},mask:function(c,g){var h,i,j,k,l,m,n,o;if(!c&&this.length>0){h=a(this[0]);var p=h.data(a.mask.dataName);return p?p():void 0}return g=a.extend({autoclear:a.mask.autoclear,placeholder:a.mask.placeholder,completed:null},g),i=a.mask.definitions,j=[],k=n=c.length,l=null,a.each(c.split(""),function(a,b){"?"==b?(n--,k=a):i[b]?(j.push(new RegExp(i[b])),null===l&&(l=j.length-1),k>a&&(m=j.length-1)):j.push(null)}),this.trigger("unmask").each(function(){function h(){if(g.completed){for(var a=l;m>=a;a++)if(j[a]&&C[a]===p(a))return;g.completed.call(B)}}function p(a){return g.placeholder.charAt(a<g.placeholder.length?a:0)}function q(a){for(;++a<n&&!j[a];);return a}function r(a){for(;--a>=0&&!j[a];);return a}function s(a,b){var c,d;if(!(0>a)){for(c=a,d=q(b);n>c;c++)if(j[c]){if(!(n>d&&j[c].test(C[d])))break;C[c]=C[d],C[d]=p(d),d=q(d)}z(),B.caret(Math.max(l,a))}}function t(a){var b,c,d,e;for(b=a,c=p(a);n>b;b++)if(j[b]){if(d=q(b),e=C[b],C[b]=c,!(n>d&&j[d].test(e)))break;c=e}}function u(){var a=B.val(),b=B.caret();if(o&&o.length&&o.length>a.length){for(A(!0);b.begin>0&&!j[b.begin-1];)b.begin--;if(0===b.begin)for(;b.begin<l&&!j[b.begin];)b.begin++;B.caret(b.begin,b.begin)}else{for(A(!0);b.begin<n&&!j[b.begin];)b.begin++;B.caret(b.begin,b.begin)}h()}function v(){A(),B.val()!=E&&B.change()}function w(a){if(!B.prop("readonly")){var b,c,e,f=a.which||a.keyCode;o=B.val(),8===f||46===f||d&&127===f?(b=B.caret(),c=b.begin,e=b.end,e-c===0&&(c=46!==f?r(c):e=q(c-1),e=46===f?q(e):e),y(c,e),s(c,e-1),a.preventDefault()):13===f?v.call(this,a):27===f&&(B.val(E),B.caret(0,A()),a.preventDefault())}}function x(b){if(!B.prop("readonly")){var c,d,e,g=b.which||b.keyCode,i=B.caret();if(!(b.ctrlKey||b.altKey||b.metaKey||32>g)&&g&&13!==g){if(i.end-i.begin!==0&&(y(i.begin,i.end),s(i.begin,i.end-1)),c=q(i.begin-1),n>c&&(d=String.fromCharCode(g),j[c].test(d))){if(t(c),C[c]=d,z(),e=q(c),f){var k=function(){a.proxy(a.fn.caret,B,e)()};setTimeout(k,0)}else B.caret(e);i.begin<=m&&h()}b.preventDefault()}}}function y(a,b){var c;for(c=a;b>c&&n>c;c++)j[c]&&(C[c]=p(c))}function z(){B.val(C.join(""))}function A(a){var b,c,d,e=B.val(),f=-1;for(b=0,d=0;n>b;b++)if(j[b]){for(C[b]=p(b);d++<e.length;)if(c=e.charAt(d-1),j[b].test(c)){C[b]=c,f=b;break}if(d>e.length){y(b+1,n);break}}else C[b]===e.charAt(d)&&d++,k>b&&(f=b);return a?z():k>f+1?g.autoclear||C.join("")===D?(B.val()&&B.val(""),y(0,n)):z():(z(),B.val(B.val().substring(0,f+1))),k?b:l}var B=a(this),C=a.map(c.split(""),function(a,b){return"?"!=a?i[a]?p(b):a:void 0}),D=C.join(""),E=B.val();B.data(a.mask.dataName,function(){return a.map(C,function(a,b){return j[b]&&a!=p(b)?a:null}).join("")}),B.one("unmask",function(){B.off(".mask").removeData(a.mask.dataName)}).on("focus.mask",function(){if(!B.prop("readonly")){clearTimeout(b);var a;E=B.val(),a=A(),b=setTimeout(function(){B.get(0)===document.activeElement&&(z(),a==c.replace("?","").length?B.caret(0,a):B.caret(a))},10)}}).on("blur.mask",v).on("keydown.mask",w).on("keypress.mask",x).on("input.mask paste.mask",function(){B.prop("readonly")||setTimeout(function(){var a=A(!0);B.caret(a),h()},0)}),e&&f&&B.off("input.mask").on("input.mask",u),A()})}})});
Ответить с цитированием
  #6 (permalink)  
Старый 05.09.2018, 17:29
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

maskedinput completed
kseosru,
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .hide{
      display: none;
  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.min.js"></script>
</head>
<body>
  <select id="country" class="form-control">
    <option value="ru">
      Россия +7
    </option>
    <option value="ua">
      Украина +380
    </option>
    <option value="by">
      Белоруссия +375
    </option>
  </select> <input id="phone" placeholder="Введите 16 цифр" type="text" class=
  "form-control">
  <script>

                              jQuery (function ($) {
                                $(function() {
                                  function showDiv()
                                  {
                                     $('.hide').toggle($("#phone").val().replace(/\D/g, '').length === 16)
                                  }
                                  function maskPhone() {
                                    var country = $('#country option:selected').val();
                                    switch (country) {
                                      case "ru":
                                        $("#phone").mask("9999 9999 9999 9999", {
                                        completed : showDiv}).on('keydown.mask',showDiv);
                                        break;
                                    }
                                  }
                                  maskPhone();
                                  $('#country').change(function() {
                                    maskPhone();
                                  });
                                });
                              });
  </script>
  <div class="hide">
    Появление DIV (скрытый )
  </div>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 05.09.2018, 17:50
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

Благодарю Вас !!!!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Волнообразное появление областей div blackdiie Общие вопросы Javascript 10 04.06.2017 17:49
Появление div после заполнения input PonyS Общие вопросы Javascript 4 11.05.2016 18:20
Появление div не могу разобраться yura_yushkevich jQuery 6 07.12.2014 13:46
При наведении на элемент появление div, положение которого постоянно меняется Poision Элементы интерфейса 5 27.01.2014 19:43
Появление блоков div в зависимости от radio Oracool Events/DOM/Window 1 04.12.2009 18:39