验证用户使用jquery添加的新输入

-2

在我的项目中，我对文本框进行了验证，该文本框在单击时突出显示边框，然后突出显示红色并弹出警告，如果在没有输入任何值的情况下单击其他区域。验证用户使用jquery添加的新输入

我也有一个按钮，允许用户使用jquery自己添加新的输入框。我想知道是否有可能使这些新输入与突出显示的边界具有相同的验证，并在使用按钮将其添加到页面时弹出警报？

编辑

 $(function() { 
    $(".options").focus(function(){ 
      $(this).addClass("focused"); 
     }); 
     }); 

    $(function() { 
     $(".options").blur(function(){ 
      $(this).removeClass("focused"); 
     }); 
     }); 

    $(function() { 
    $(".options").focusout(function() { 
     $(this).addClass("unfocused"); 
      if (!$(this).val()) { 
       alert("Please ensure you have answered the question."); 
      } 
     }); 
     }); 

    $(function() { 
      $(".options").blur(function(){ 
       $(this).removeClass("unfocused"); 
      }); 
      });

道歉，上面是我用过的已经验证文本框的jQuery代码。焦点类只是将边框变成绿色，而未聚焦则将焦点变为红色。

<div class="addtextbox"><input type="submit" class="AddOption" value="Click To Add New Option"></div> 



$(function() { 
    $(".addtextbox").click(function() { 
     $(".addtextbox").before("<input class='options'><br>"); 
    }); 
});

这里是我用来添加文本框

来源

2015-08-21 1D9C

是，它几乎肯定可以的。请告诉我们你已经尝试了什么。 – George

请提供示例代码以 – vijayP

$(document).ready(function(){ 
 
    
 
    $(document).on("focus", ".options", function(){ 
 
    
 
    $(this).addClass("focused"); 
 
    $(this).removeClass("unfocused"); 
 
    
 
    }); 
 
    
 
    
 
    $(document).on("blur", ".options", function(){ 
 
    
 
    $(this).removeClass("focused"); 
 
    $(this).addClass("unfocused"); 
 
    
 
    if (!$(this).val()) { 
 
     alert("Please ensure you have answered the question."); 
 
    } 
 
    
 
}); 
 
    
 
    
 
    })

来源

2015-08-21 08:50:48 vijayP

开头嗨，这已经解决了这个问题。但是，即使在必填字段中有输入，它仍会保持红色，而不是回到没有颜色。 – 1D9C

嗨，感谢您的帮助，我已经设法重新排列代码，使其工作，因为它应该:) – 1D9C

好的...好.... :) – vijayP

你都不可能使用依赖于HTML5的功能，如required新的jQuery插件，例如和委托验证事件的代码，使其工作即使在AJAX调用的情况下也是如此。在你的Ajax响应，尝试生成输入等：

<input type="text" required="required" pattern="{d}" />

来源

2015-08-21 08:32:41

验证用户使用jquery添加的新输入

回答

相关问题