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

debugcn 发表于 Dev

德瓦扬·塔库尔

$(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] 删除。