gpt4 book ai didi

javascript - 如何验证具有多个相同名称的动态添加输入?

转载 作者:行者123 更新时间:2023-12-01 03:58:02 26 4
gpt4 key购买 nike

您好,我尝试使用 javascript 或 jquery (但不使用 jquery 验证插件)对具有相同名称并添加动态输入的多个输入进行表单验证。我希望所有的输入都需要填写。但这行不通。在这种情况下我该如何验证它?

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script>
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID

var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(wrapper).append('<div><input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
}
});

$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
<script>
function chk_null()
{

$('input[name="mytext[]"]').each(function() {
if($(this).val() == "")
{
alert("Please Fill");
return false;
}
});
}
</script>

</head>
<body>
<form action="new2.php" method="post" onsubmit="return chk_null();">
<div class="input_fields_wrap">
<button type="button" class="add_field_button">Add More Fields</button>
<div><input type="text" name="mytext[]"></div>
<div><input type="text" name="mytext[]"></div>

</div>
<input type="submit" value="submit">
</form>
</body>
</html>

最佳答案

我建议一个替代方案。将按钮类型设置为“按钮”,如果检查正常,则提交表单。 Here the example.

<form action="new2.php" method="post">
.
.
.
<input type="button" value="submit" onclick="chk_null();">
.
.
.
function chk_null() {
var allFilled=true;
$('input[name="mytext[]"]').each(function() {
if ($(this).val() == "") {
alert("Please Fill");
allFilled = false;
}
});
if (allFilled) $('form').submit();
}

关于javascript - 如何验证具有多个相同名称的动态添加输入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42468820/

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