使用输入属性 (id, name) 为文本类型的每个输入创建一个标签

德瓦扬·塔库尔

$(document).ready(function() {
  $('input').each(function() {
    if ($(this).name != '') {
      var label = $("<label >").attr('style', "display:none !important;").attr('for', $("input").attr("id")).text($("input").attr("name"));
      $('input').append(label);
    }
  });
});
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
  </script>

  <head>

    <body>
      <table id="myTable">
        <tbody>
          <tr>
            <td>Account Reference</td>
            <td><input type="text" name="account_reference_textbox" id="account_reference_textbox" maxlength="35" value="">
            </td>
            <td>Forename</td>
            <td><input type="text" name="first_name_textbox" id="first_name_textbox" maxlength="10" value=""></td>
          </tr>
          <tr>
            <td>Customer Reference</td>
            <td><input type="text" name="customer_reference_textbox" id="customer_reference_textbox" maxlength="25" value="">
            </td>
            <td>Surname</td>
            <td><input type="text" name="last_name_textbox" id="last_name_textbox" maxlength="20" value=""></td>
          </tr>
          <tr>
            <td>Company Name</td>
            <td><input type="text" name="company_name_textbox" id="company_name_textbox" maxlength="20" value=""></td>
          </tr>
        </tbody>
      </table>
    </body>
    <html>

我正在尝试使用 Jquery 使用其属性名称和 Id 为文本类型的每个输入创建标签。

我已经使用输入属性成功创建了一个标签,但未能获得正确的位置。

史瑞

您正在使用$('input')附加,因此所有内容label都附加在第一个输入中,因此用于$(this)附加label到正确的位置。

$(document).ready(function() {
  $('input').each(function() {
    if ($(this).name != '') {
      var label = $("<label >").attr('style', "display:none !important;").attr('for', $("input").attr("id")).text($("input").attr("name"));
      $(this).parent().append(label);
    }
  });
});
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
  </script>

  <head>

    <body>
      <table id="myTable">
        <tbody>
          <tr>
            <td>Account Reference</td>
            <td><input type="text" name="account_reference_textbox" id="account_reference_textbox" maxlength="35" value="">
            </td>
            <td>Forename</td>
            <td><input type="text" name="first_name_textbox" id="first_name_textbox" maxlength="10" value=""></td>
          </tr>
          <tr>
            <td>Customer Reference</td>
            <td><input type="text" name="customer_reference_textbox" id="customer_reference_textbox" maxlength="25" value="">
            </td>
            <td>Surname</td>
            <td><input type="text" name="last_name_textbox" id="last_name_textbox" maxlength="20" value=""></td>
          </tr>
          <tr>
            <td>Company Name</td>
            <td><input type="text" name="company_name_textbox" id="company_name_textbox" maxlength="20" value=""></td>
          </tr>
        </tbody>
      </table>
    </body>
    <html>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

通过在 javascript 中使用 Name 而不是 Id 来获取输入类型文本的值

您好,我的目标是,当我点击“创建复选框”按钮时,它将自动创建一个ID为ID的复选框,而无需使用输入类型的文本

输入文本类型的输入字段的请求ID

jQuery将输入的name = id元素映射到form.id属性,为什么?

如何使用Jquery删除隐藏输入字段的Name属性?

为数组中的每个对象创建一个输入和标签

在清除输入标签时,我得到一个组件正在更改要控制的文本类型的不受控制的输入

在输入标签内增加ID属性

在标签的 for 属性中添加输入的 ID

让OneToOneField to User仅使用ModelForm呈现一个文本输入(对于User.first_name)

使用name属性中的双括号[]发送输入类型复选框是否安全?

使用Firebase Firestore为Javascript中每个动态创建的行分配一个文档ID

当我具有基本类型的另一个属性的BsonId属性时,是否可以在派生类中使用“ Id”属性?

为每个新输入创建一个变量

如何获取使用 Dapper 输入的最后一个 ID?

Webbrowser 自动登录,没有输入框的 id/name

获取带有“ id”或“ name”的输入元素的值

如何使用jquery通过具有特殊字符的name属性来定位输入元素?

如何在Angular 9的输入字段中强制使用name属性?

如何为一个 ID 下的所有文本输入添加一个类?

Flask-WTForms:动态创建 name 和 id 属性

JS +用户输入:一个文本输入可更改正文中的多个ID /类

发送相同输入ID的不同标题属性

使用JavaScript为每个输入的JSON对象创建一个按钮

在Django中,如何使用django表单从html输入标签中提取ID属性,而无需使用

创建一个要求用户输入所需用户ID并存储该ID的对象

在Yii2中使用ActiveField时设置输入字段的ID属性?

如何使用赛普拉斯定位没有id属性的嵌套输入?

Knockout.js 3.1.0使用$ index上下文绑定输入名称和ID属性