峡山飞云 2017-02-08 07:48 采纳率: 100%
浏览 1658
已采纳

js前端问题，求助各路大神，真心感谢！急

图片说明

条件：手动输入中间的4位手机号 如果和后台取的值相同可以提交，如果不填或者填错就提交不了。

  • 写回答

14条回答 默认 最新

  • 邱金金 2017-02-08 10:43
    关注

    <!DOCTYPE html>

    < head>
    < script src="http://libs.baidu.com/jquery/2.0.0/jquery.js">
    < style>
    input{
    width: 20px;
    }
    .btn{
    clear:both;width:100px;height:30px;background: #c0b7b0;border-radius: 3px;color:#F0F0F0;
    text-align: center;line-height: 30px;
    }
    < /style>
    < /head>
    < body>
    < div style="float:left;">
    < span id="spMobileHeader">
    < /div>
    < div style="float:left;">
    < input type="text" maxlength="1" onkeyup="changefocus(1);">
    < input type="text" maxlength="1" onkeyup="changefocus(2);">
    < input type="text" maxlength="1" onkeyup="changefocus(3);">
    < input type="text" maxlength="1" onkeyup="checkMobile();">
    < /div>
    < div style="float:left;">
    < span id="spMobileEnd">
    < /div>
    < div id="testBtn" class="btn">提交
    < /body>
    < script type="text/javascript">
    $(function (){
    var mobile="12345678911"; //这是后台传过来的,我写死的,你拿到后自己变掉就可以了
    $("#spMobileHeader").text(mobile.substring(0,4)); //显示前4个
    $("#spMobileEnd").text(mobile.substring(8,11)); //显示后3个
    });

    function changefocus(index){
    $("input").each(function (i){
    if (i==index){
    $(this).focus();
    }
    });
    }
    function checkMobile(){
    var mobile="12345678911"; //这是后台传过来的
    var inputMobile="";
    $("input").each(function (i){
    inputMobile+=$(this).val();
    });
    var contrastMoblie=mobile.substring(4,8);
    if (inputMobile==contrastMoblie){
    /*
    在这里做你需要做的事，我只是改了下按钮的颜色
    */
    $("#testBtn").css("background","#960019");
    $("#testBtn").css("color","white");
    }
    }

    $("input").keyup(function(e){
    //退格键
    if(e.keyCode==8){
    $(this).focus();
    }
    })
    < /script>
    < /html>

    在第二行加个html 就好了,吗蛋, 个人还是不建议在这进行比较的,因为不安全

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(13条)

报告相同问题？

悬赏问题

  • ¥15 metadata提取的PDF元数据，如何转换为一个Excel
  • ¥15 关于arduino编程toCharArray()函数的使用
  • ¥100 vc++混合CEF采用CLR方式编译报错
  • ¥15 coze 的插件输入飞书多维表格 app_token 后一直显示错误，如何解决？
  • ¥15 vite+vue3+plyr播放本地public文件夹下视频无法加载
  • ¥15 c#逐行读取txt文本，但是每一行里面数据之间空格数量不同
  • ¥50 如何openEuler 22.03上安装配置drbd
  • ¥20 ING91680C BLE5.3 芯片怎么实现串口收发数据
  • ¥15 无线连接树莓派，无法执行update，如何解决？（相关搜索：软件下载）
  • ¥15 Windows11, backspace, enter, space键失灵