代码之家  ›  专栏  ›  技术社区  ›  Kyan

如何在点击按钮后实时判断输入框中输入了什么!=提交?

  •  0
  • Kyan  · 技术社区  · 6 年前

    我在表单中有一个按钮,如果某些输入字段不符合条件,它将不起作用。最好的办法是什么?是否需要向这些字段添加常量侦听器以更新值?

    如果你给我指的是正确的方向,我就从那里开始。

    $(document).ready(function(){
        $("#button").click(function(){
            if(selectedSlots.length < 2 ||
            $("#field1").length < 1 ||
            $("#field2").length < 1){
                var origMsg = $(this).get(0).parentNode.innerHTML;
                var errorMsg = "<p style=\"text-align:center;padding:0;margin:0;\">Please ";
                    if(selectedSlots.length < 1)errorMsg += "select at least one availability slot";
                    if($("#field1").length < 1){errorMsg += "enter the position you wish to apply for"};
                    if($("#field2").length < 1){errorMsg += "enter the amount of hours you would like to work"};
                    errorMsg += " before continuing.</p>";
    
                $(this).get(0).parentNode.innerHTML = origMsg + errorMsg;
    
                return;
    
            }
            $("#currentDiv").slideUp();
            $("#nextDiv").slideDown();
    
        });
    });
    
    2 回复  |  直到 6 年前
        1
  •  0
  •   balzee    6 年前

    当用户单击submit按钮以外的任何其他位置时,请尝试onBlur事件验证并设置输入错误。

        2
  •  0
  •   Kyan    6 年前

    缺少的只是元素后面的这个小片段 .get(0).value. 谢谢大家抽出时间!

    $(document).ready(function(){
        $("#button").click(function(){
            if(selectedSlots.length < 2 ||
            $("#field1").length < 1 ||
            $("#field2").length < 1){
                var origMsg = $(this).get(0).parentNode.innerHTML;
                var errorMsg = "<p style=\"text-align:center;padding:0;margin:0;\">Please ";
                    if(selectedSlots.length < 1)errorMsg += "select at least one availability slot";
                    if($("#field1").get(0).value.length < 1){errorMsg += "enter the position you wish to apply for"};
                    if($("#field2").get(0).value.length < 1){errorMsg += "enter the amount of hours you would like to work"};
                    errorMsg += " before continuing.</p>";
    
                $(this).get(0).parentNode.innerHTML = origMsg + errorMsg;
    
                return;
    
            }
            $("#currentDiv").slideUp();
            $("#nextDiv").slideDown();
    
        });
    });