小编Sou*_*Web的帖子

专注于引导选项卡中的必填字段

下午,我使用PHP,HTML5和Bootstrap.我已经构建了一个分隔5个选项卡的表单,在这个表单中有几个必填字段.所需的所有输入字段都是"文本",并且还标有required ="required"aria-required ="true".

在提交时,如果在当前选项卡上,html5验证会捕获错误,但是我想使用一些jquery来重新关注尚未填充的正确选项卡和输入字段并显示警告框.我不确定这是否可行..

要么就是这样,如果它更容易检查标签上的标签需要字段更改..

页面上只有一个表单.

非常感谢

**编辑**我在修补后为所需字段创建了一个警报功能,但它仍然不会更改标签以专注于必填字段.'productbutton'是整个表单的提交按钮的ID.'product_form'是我表单的ID.

$('#productbutton').click(function(){
var error = 0;
var msg = 'An Error Has Occured.\n\nRequired Fields missed are :\n';
$(':input[required]', '#product_form').each(function(){
    $(this).css('border','2px solid green');
    if($(this).val() == ''){
        msg += '\n' + $(this).attr('id') + ' Is A Required Field..';
        $(this).css('border','2px solid red');
        if(error == 0){ $(this).focus(); }
        error = 1;
    }
});
if(error == 1) {
    alert(msg);
    return false;
} else {
    return true;
}
});
Run Code Online (Sandbox Code Playgroud)

基本上如果error = 1,它将弹出错误消息,其中输入id已被遗漏.然后它无法提交返回false的表单.它确实专注于错过的场地,并在场地周围放置一个红色边框.但它并不专注于标签..否则它将提交表格.

validation jquery twitter-bootstrap

3
推荐指数
3
解决办法
9757
查看次数

标签 统计

jquery ×1

twitter-bootstrap ×1

validation ×1