javascript - 如何在jquery中通过类名获取输入元素值

标签 javascript jquery html

我想获取输入元素值,它们具有“features”类。我可以访问所有这些

alert($('.features').length);

如果我错了,请纠正我,$('.features') 是一个 html 输入元素数组。但是我尝试过

Array.isArray($('.features')) // returned false

我想访问每个元素的值。如何实现这一目标 我尝试做一个,下面是代码片段

function maintest() {

 for(i = 0 ; i < 5 ; i ++ ) {
  $("<input>").attr({"class":"features"}).appendTo("#mainDiv").val("input"+i);
  $("<br/><br/>").appendTo("#mainDiv");
 }
  
  $("<button> Click me! </button>").click(function() {
  let inputArray = [];
  inputArray = $('.features');
  alert(inputArray.length);
    //alert( inputArray[0].val());
    //what must be put here to see the data value
  }).appendTo("#mainDiv");
 }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<body onload="maintest()">
  <div id="mainDiv"></div>
</body>

最佳答案

在 JavaScript 中,将变量设置为某个值会覆盖之前的值。它不强制类型,因此这些行:

let inputArray = [];
inputArray = $('.features');

相同
let inputArray = $('.features');

$() 返回一个 jquery 集合,而不是一个 javascript 数组;当然,有相似之处,但它不是一个“数组”。

要获取值,您可以循环遍历集合,也可以使用 .map 来提取值,例如:

var valuesArray = $('.features').map(function() {
                      return $(this).val();
                  }).toArray();

function maintest() {

  for (i = 0; i < 5; i++) {
    $("<input>").attr({ "class": "features" })
        .appendTo("#mainDiv")
        .val("input" + i);
    $("<br/><br/>").appendTo("#mainDiv");
  }

  $("<button> Click me! </button>").click(function() {
    let inputArray = $('.features');
    var values = inputArray.map(function() {
      return $(this).val();
    }).toArray();
    console.log(values);
  }).appendTo("#mainDiv");
}

$(() => maintest());
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="mainDiv"></div>

关于javascript - 如何在jquery中通过类名获取输入元素值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60283614/

相关文章:

javascript - Chart.js - 如何设置动画速度?

javascript - 如何在 Photoshop 脚本中为值创建输入字段

jquery - Twitter 时间轴小部件因 JQuery “Hide/Show” 而消失

html - Div 类最小宽度仍在调整大小

javascript - 单击电子邮件中的链接以填充文本字段

javascript - 我可以将 socket.io 客户端 ID 转换为稍短的客户端 ID,而不会遇到冲突风险吗?

jQuery - 将 div 包裹到特定元素

jquery - 如何在 div #content 加载时显示 div #loading

PHP 为中间的每个框着色

php - 显示在使用 php 从 mysql 检索的内容上的特殊字符