HTML表单使用JavaScript输入标签名元素数组

前端之家收集整理的这篇文章主要介绍了HTML表单使用JavaScript输入标签名元素数组前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这是一个两部分的问题。有人在第二天回答了一个类似的问题(在PHP中也包含了关于这种类型的数组的信息),但是我找不到。

首先,在窗体中输入标签的name元素末尾创建的数组的正确术语是什么?

<form>

    <input name="p_id[]" value="0"/>
    <input name="p_id[]" value="1"/>
    <input name="p_id[]" value="2"/>

</form>

2.)如何使用JavaScript获取该数组的信息?具体来说,我现在只是想计算数组的元素。这是我做的,但它不工作。

function form_check(){
    for(var i = 0; i < count(document.form.p_id[]); i++){  //Error on this line

        if (document.form.p_name[i].value == ''){
            window.alert('Name Message');
            document.form.p_name[i].focus();
            break;
        }

        else{
            if (document.form.p_price[i].value == ''){
                window.alert('Price Message');
                document.form.p_price[i].focus();
                break;
            }

            else{
                update_confirmation();
            }
        }
    }
}

解决方法

1.) First off,what is the correct terminology for an array created on the end of the name element of an input tag in a form?

“经常混淆PHPism”

就JavaScript而言,一堆具有相同名称的表单控件只是一堆具有相同名称的表单控件,并且具有包括方括号的名称的表单控件只是具有包含方括号的名称的表单控件。

具有相同名称的表单控件的PHP命名约定有时是有用的(当您拥有多个控件组时,可以执行以下操作:

<input name="name[1]">
<input name="email[1]">
<input name="sex[1]" type="radio" value="m">
<input name="sex[1]" type="radio" value="f">

<input name="name[2]">
<input name="email[2]">
<input name="sex[2]" type="radio" value="m">
<input name="sex[2]" type="radio" value="f">

)但是会混淆一些人。一些其他语言已经采用了惯例,因为它最初是写的,但通常只是一个可选功能。例如,通过this module for JavaScript

2.) How do I get the information from that array with JavaScript?

它仍然只是从元素获取与表单控件相同名称属性。诀窍在于,由于表单控件的名称包括方括号,所以您不能像任何其他JavaScript property name that includes special characters那样使用dot notation and have to use square bracket notation

既然你有这个名称的多个元素,它将是一个集合,而不是一个单一的控件,所以你可以循环使用一个标准的循环,利用它的length属性

var myForm = document.forms.id_of_form;
var myControls = myForm.elements['p_id[]'];
for (var i = 0; i < myControls.length; i++) {
    var aControl = myControls[i];
}
原文链接:https://www.f2er.com/html/233386.html

猜你在找的HTML相关文章