gpt4 book ai didi

javascript - 使用 jQuery 显示警告

转载 作者:行者123 更新时间:2023-12-01 01:54:25 25 4
gpt4 key购买 nike

我正在做一些jQuery表单验证,我提出了一个问题。到目前为止我有以下代码:

// catch any form submission
$('form').submit(function () {
'use strict';
// if the browser doesn't support HTML5's required attribute
if (!Modernizr.input.required) {
// catch any field that should be required
$(this).find('input[required]').each(function () {
// if is empty
if ($(this).val() === '') {
// create a span that contains a warning to the user
var requiredFieldWarning = document.createElement('span');
requiredFieldWarning.text = 'This field is required.';

// display the span next to the current field
}
});
}
});

我正在尝试在已提交表单的任何未验证的输入旁边“附加”或显示一个 span,但我不知道如何操作。我想不引人注目地做到这一点,这就是为什么我在 JavaScript 中创建上述 span 的原因。

此外,如果提交表单的任何字段未验证,如何阻止表单提交?

最佳答案

为什么要重新发明轮子?你应该使用jquery form validation插件..

编辑:添加代码以防止提交无效表单。

回答您的问题:

$('form').submit(function (e) {
'use strict';
var valid = true;
var $form = $(this);
$form.find("span.error").remove();
// if the browser doesn't support HTML5's required attribute
if (!Modernizr.input.required) {
// catch any field that should be required
$form.find(':input[required]').each(function () {
// if is empty
var $this = $(this);
if ($.trim($this.val()) === '') {
// create a span that contains a warning to the user
$this.after("<span class='error'>This field is required.</span>");
valid = false;
}
});
}
if(!valid){
e.preventDefault();
}
});

这是一个较短的版本:

$('form').submit(function (e) {
'use strict';
Modernizr.input.required ? e[$(this).find("span.error").remove().end()
.find(':input[required][value=""]')
.after("<span class='error'>This field is required.</span>")
.length ? 'preventDefault': 'isDefaultPrevented']() : null;
});

关于javascript - 使用 jQuery 显示警告,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10309128/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com