jQuery选择器不使用ID标签

时间:2018-12-18 10:29:23

标签: jquery

我有这个JavaScript代码来查找tr中的所有输入元素

var row = button.parentElement.parentElement;
if ((typeof row.id === 'undefined') || (row.id ==='' )) {
    row.id = '__clearsky_formdata';
}
var jsondata = {form: $("#__clearsky_formdata :input").serializeArray(), button: button.innerText };

if (row.id === '__clearsky_formdata') {
    row.id = '';
}

只是想知道是否存在一种使用:input的方法而无需先构造ID,然后使用$(#:input)并最终将ID重新“重置”

例如使用$(row):input或类似内容的形式

2 个答案:

答案 0 :(得分:1)

绝对不需要设置id来获得子元素的引用。

您可以直接使用row创建jQuery对象,然后使用.find(selector) / .children(selector)等方法

$(row) //create a jQuery object
  .find(':input') //get reference to input elements

等同于

$("#__clearsky_formdata :input")

答案 1 :(得分:0)

您可以在Vanilla JavaScript中使用Element querySelectorAll来获取该行中的所有输入。

const row = button.parentElement.parentElement;

// Get all input fields from row element
const inputFields = Array.from(row.querySelectorAll('input'));

这是一个演示:

function myFunction() {
  const allInputFields = Array.from(document.querySelector("#myDIV").querySelectorAll('input'));

  const inputFieldValues = allInputFields.map(x => x.value);
  console.log(inputFieldValues);
}
<!DOCTYPE html>
<html>

<head>
  <style>

  </style>
</head>

<body>

  <div id="myDIV">
    <input type="text" value="2">
    <input type="text" value="3">
  </div>

  <button onclick="myFunction()">Try it</button>

</body>

</html>