Question

目标：单击div时带有密码输入弹出窗口的Div（获取此部分）。将带有按钮的密码输入到表单的文本输入字段中。输入正确的4位数后，无需按任何提交按钮即可重定向到新页面。

我拥有的东西：我通过切换div的样式弹出了div（显示：隐藏）为了获得pin代码输入div，你需要点击的div是名为s_wrapper_date_time。

我需要的是什么：当按下任何按钮时，它应该被添加到文本输入字段中。输入正确的4位数字后，会自动重定向到不同的页面。没有任何提交按钮。

代码： Home.php

<div id="code_input" class="s_input_code_content s_hidden">
        <form onsubmit="javascript: return false;">
            <input id="input_screen" class="s_input_text" type="text" maxlength="4"/>
            <div id="s_keypad">
                <button id="7" value="7" class="s_btn_g s_btn_number">7</button>
                <button id="8" value="8" class="s_btn_g s_btn_number">8</button>
                <button id="9" value="9" class="s_btn_g s_btn_number">9</button>
                <button id="4" value="4" class="s_btn_g s_btn_number">4</button>
                <button id="5" value="5" class="s_btn_g s_btn_number">5</button>
                <button id="6" value="6" class="s_btn_g s_btn_number">6</button>
                <button id="1" value="1" class="s_btn_g s_btn_number">1</button>
                <button id="2" value="2" class="s_btn_g s_btn_number">2</button>
                <button id="3" value="3" class="s_btn_g s_btn_number">3</button>
                <button id="0" value="0" class="s_btn_g s_btn_null">0</button>
            </div>
        </form>
    </div>

脚本：

 <script type="text/javascript">
            $(".s_wrapper_date_time").click(function(){
                $("#code_input").toggleClass("s_hidden");
                $("#code_wrapper").toggleClass("s_hidden");
                //window.location.href = "overview.php?a=0";
            });
        </script>

感谢您的时间。

Answer 1

        pin_length = 4; //set your pin length.
        $(".s_btn_g").on("click", function(){
            $("#input_screen").val($("#input_screen").val() + $(this).text());
        });
        $("#input_screen").on("change", function(){
            if($(this).val().length === pin_length) $("form").submit(); //or window.location.href, whatever
        });

最好使用表单名称/ ID并使用表单操作属性，而不是使用提交将查看器向下移动页面。此外，您可以禁用＆＃34;输入＆＃34;关键提交。

使用HTML按钮添加文本以输入和提交表单

1 个答案: