Question

假设我已经<div>：

<div id="input-containers">
   <div class="form-group" datatype="admins operators">
      <label for="first-name"> *</label>
      <input type="text" id="first-name" class="form-control required" />
   </div>

   <div class="form-group" datatype="admins operators">
      <label for="last-name"></label>
      <input type="text" id="last-name" class="form-control required" />
   </div>
</div>

正如您所看到的，我有两个<input>，我需要做的是让所有<input>以operators作为数据类型，我这样做了：

$('#input-containers :input').each(function()
{
   console.log($(this).attr('datatype'));
});

但这会返回undefined，为什么？

Answer 1

这将有效：

$('#input-containers .form-group').each(function(){
   console.log($(this).attr('datatype'));
});

或者，如果您想使用代码，则应将数据类型属性放在输入标记上。

Answer 2

您需要使用.closest()来遍历父div，因为this指的是input并不是所述属性

$('#input-containers form-group[datatype] :input').each(function() {
    console.log($(this).closest('.form-group').attr('datatype'));
});

＆＃13;

$('#input-containers form-group[datatype] :input').each(function() {
	console.log($(this).closest('.form-group').attr('datatype'));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="input-containers">
  <div class="form-group" datatype="admins operators">
    <label for="first-name">*</label>
    <input type="text" id="first-name" class="form-control required" />
  </div>

  <div class="form-group" datatype="admins operators">
    <label for="last-name"></label>
    <input type="text" id="last-name" class="form-control required" />
  </div>
</div>

＆＃13;

但我建议您使用data-*前缀属性

<div class="form-group" data-type="admins operators">

然后使用

$('#input-containers  form-group[datatype] :input').each(function() {
    console.log($(this).closest('.form-group').attr('data-type'));
});

.data()也可以使用。但是应该明智地使用它。

Answer 3

您应该定位具有类名.form-group的父div并获取属性

检查以下代码段

$(document).ready(function () {
  $('#input-containers :input').each(function()
  {
     console.log($(this).parent('.form-group').attr('datatype'));
  });
});

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
<div id="input-containers">
   <div class="form-group" datatype="admins operators">
      <label for="first-name"> *</label>
      <input type="text" id="first-name" class="form-control required" />
   </div>

   <div class="form-group" datatype="admins operators">
      <label for="last-name"></label>
      <input type="text" id="last-name" class="form-control required" />
   </div>
</div>

Answer 4

尝试这种方式也可以，

<强> JS：

$('#input-containers :input').each(function()
{
   console.log(this.parentElement.getAttribute('datatype'));
});

如何在jquery中获取数据类型属性？

4 个答案: