时间戳

首页 > 解决方案 > 使用 data-id 标签定位字段的内容

jquery - 使用 data-id 标签定位字段的内容

问题描述

已编辑以在我尝试定位的页面上包含 HTML 元素...

我正在尝试定位页面上输入字段的内容，该页面具有data-id标签（FORENAME在代码示例中）。

如果我将一个固定的字符串变量放入我的代码中（即 set var fieldValue = "dave"，它会按预期工作 - 我只是无法将内容添加到变量中。

提前致谢。

<div >
        <input aria-labelledby="TribalTech_EBS_Agent5_Models_Page_Controls_StaticTextModel_1100013026_DISP_FIRST_NAME " class="Primary form-control" data-id="FORENAME" data-val="true" data-val-length="First Name - The field value must be a string with a maximum length of 50" data-val-length-max="50" data-val-required="First Name - A value is required" id="DataModel_DataLinks_Dummy__Data_0__Items_FORENAME__Value" name="DataModel.DataLinks[Dummy].Data[0].Items[FORENAME].Value" tabindex="0" type="text" value="" />
        <input id="DataModel_DataLinks_Dummy__Data_0__Items_FORENAME__OriginalItem_Value" name="DataModel.DataLinks[Dummy].Data[0].Items[FORENAME].OriginalItem.Value" type="hidden" value="" />
</div>

$(document).ready(function() {
  $('[data-id=FORENAME]').change(function() {
    validateStuff();
  });
});

function validateStuff() {
  var fieldValue = $('[data-id="FORENAME"]').attr("content"); // this is the issue

  if (fieldValue == "") {
    alert("You must enter a value");
  } else {
    if (fieldValue == "brian" || fieldValue == "simon") {
      alert("Hooray!  Valid entry in field");
    } else {
      alert("This is invalid input");
    }
  }
}

标签： jquery

解决方案

这里缺少引号[data-id=FORENAME]。此外，您应该$('[data-id="FORENAME"]').val()改用：

(function() {
   "use strict";
   $(document).ready(function() {
      $('[data-id="FORENAME"]').change(function() {
         validateStuff();
      });
   });

   function validateStuff() {
      var fieldValue = $('[data-id="FORENAME"]').val();
      console.log(fieldValue);
      if (fieldValue == "") {
         alert("You must enter a value");
      } else {
         if (fieldValue == "brian" || fieldValue == "simon") {
            alert("Hooray!  Valid entry in field");
         } else {
            alert("This is invalid input");
         }
      }
   }
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input data-id="FORENAME">

推荐阅读