仅获取输入类型文本,而不获取选择器字段

Get only the input type text not the chooser fields

本文关键字:获取 选择器 字段 文本 输入 类型      更新时间:2023-09-26
'<tr>
<td class="label" width="40%"> Business Unit Code </td>
<td class='inputField">
<input type="text" value name="attribute1" size="20" readonly     maxLength="25">"&nbsp;"
<input class="button" name="button1" type ="button" size="200" value=".." alt="..." onclick="function1{};">
</td>
</tr>
<tr>
<td class="label" width ="40%" >style</td>
<td class="inputField">
<select name="attribute2">
<option selected value></option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</td>
</tr>
<tr>
<td class="label" width="40%"> car line </td>
<td class='inputField">
<input type="text" name="attribute3" size="null" value>
</td>
</tr>`

在 ablove 代码中,我只想获取输入字段"attribute3"。如果我尝试使用javascript"document.getElementsByClassName('inputfield'(",它将获得attribute1和attribute3。但是我希望 attribute3 的值来验证这些值。请提供 JavaScript 验证代码。

根据 Rao @Guruprasad注释,您需要所有输入文本字段。

在 JavaScript 中,你可以做到:

var inputs = document.getElementsByTagName('input');
for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type.toLowerCase() == 'text') {
        console.log(inputs[i].value);
    }
}

在 Jquery 中,你可以执行以下操作:

$("input:text")
您可以使用

getElementsByName

var x = document.getElementsByName("attribute3");

请注意,它返回一个 NodeList 对象,表示 具有指定名称的元素的集合。元素在 返回的集合按照它们在源代码中显示的方式进行排序。因此,如果您想验证其值,则可能需要执行document.getElementsByName("attribute3")[0].value

因此,我建议如果您将 id s 分配给您的elements并使用返回单element getElementById会很好id因为 s 在DOM中是唯一的


更新

要获取所有input type=text元素,请使用document.querySelectorAll

例如:

var nodes = document.querySelectorAll("#yourformid input[type=text]");
for (var i=0; i<nodes.length; i++)
{
    //get the value using nodes[i].value
}
Selector:  document.querySelectorAll('[name="attribute3"]')
  Value : document.querySelectorAll('[name="attribute3"]')[0].value

如果你想要纯JavaScript,你可以考虑以下几点:

//<![CDATA[
var pre = onload;
onload = function(){
if(pre)pre();
var doc = document, bod = doc.body;
function E(id){
  return doc.getElementById(id);
}
function N(name, element){
  var e = element || doc;
  return e.getElementsByName(name);
}
function cN(className, element){
  var e = element || doc;
  if(e.getElementsByClassName){
    return e.getElementsByClassName(className);
  }
  else{
    var x = e.getElementsByTagName('*'), a = [];
    for(var i=0,l=x.length; i<l; i++){
      var t = x[i];
      if(t.className === className){
        a.push(t);
      }
      return a;
    }
    return false;
  }
}
/* console.log(N('attribute3')[0].value);
  or
   console.log(cN('inputField')[2].firstChild.value);
*/
}
//]]>

当然,第二个注释掉console.log取决于您.firstChild是否真的是元素而不是文本节点。

如果您希望表单上的每个文本元素的值,使用上面的代码,您可以这样做:

function getTextInputVals(formElement){
  var els = formElement.elements, a = [];
  for(var i=0,l=els.length; i<l; i++){
    var e = els[i];
    if(e.type === 'text'){
      a.push(e.value);
    }
  }
  return a;
}
// console.log(getTextInputVals(doc.form[0]));

我尝试了以下方法,它有效..感谢您的快速回复

function analyseFreetextField() {
    var fieldValue = "";
    var fieldName = "";
    var inp = document.getElementsByTagName('td');
    for (var i = 0; i < inp.length; i ++) {
        if (inp[i].className == 'inputField') {
            if (inp[i].childElementCount == 1 && inp[i].firstElementChild.type == 'text' ) {
               fieldName = inp[i].firstElementChild.name;
               fieldValue = inp[i].firstElementChild.value;
               if (!alphanumeric(fieldValue)) {
                   alert('Invalid value detected' + fieldValue);
               }
           }
       }
    }
}