Question

我有许多带type="text"

的输入字段

<input type="text" id="...">
<input type="text" id="...">
<input type="text" id="...">
...
<input type="text" id="...">
<input type="text" id="...">
<input type="text" id="...">

我想阻止在每个输入上输入type="text"。有没有办法对这样的输入进行分组：

<inputgroup type="text">
   <input id="...">
   <input id="...">
   <input id="...">
</inputgroup>

该解决方案可以使用HTML，Javascript或其他任何内容进行编码。

Answer 1

您可以创建一个javascript函数，在div中动态注入输入标记

(function(){
var inject='';
for(var i=0;i<10;i++){
    inject+="<input type='text' value='"+i+"' id='id_"+i+"'/><br/>"
}
$('#inject').html(inject);

})();


<div id="inject">
//input tags will be injected here after function execution
</div>

演示：https://jsfiddle.net/abk0hvts/

Answer 2

没有

有一种方法可以对输入进行分组：<fieldset>和<legend>，但这是根据要输入的内容对它们进行分组（例如，当您有多个字段组成时地址的不同部分。）

在HTML中，无法明确设置type属性。

也就是说，type="text"是默认，因此您可以完全省略该属性（除非您出于其他原因（例如使用CSS属性选择器）依赖它）。 / p>

您也可以通过编程方式生成HTML（例如，使用模板语言）。

Answer 3

您必须使用JavaScript / jQuery来实现您的目标。您正在寻找的是 DEMO 。

    <!--Group all your input fields within a 'div' and give this div a unique ID-->
    <div id="inputGroupText">
      <input id='a' />
      <input id='b' />
      <input id='c' />
    </div>

<script>
     $(document).ready(function(){
          //iterate through the div which groups all the 'input' fields
          $('#inpuGroupText').children('input').each(function () {
               // you can substitute 'text' with 'email', 'password' etc. depending on your need
               $(this).attr('type', 'text');
          });
     });
</script>

注意：如果您只是想避免写type='text'，那么您可以忽略它，因为＆＃39; text＆＃39;是＆＃39; type＆＃39;的默认值属性，如果您没有为其指定值，浏览器会自动将输入字段视为type=text。

Answer 4

相同的解决方案，但代码更具可读性：）

<script>
    $(document).ready(function () {
      var parent = document.getElementById('autobot');
      var tags = parent.getElementsByTagName('input');
      for (var i = 0; i < tags.length; i++) {
        tags[i].setAttribute('type', 'text');
      }
    });
</script>

<div id="autobot">        
    <input>
    <input>
    <input>
  </div>

HTML：分组输入字段

4 个答案: