Question

我正在尝试使用jQuery来检测表行是否有一个或两个输入......

<tr class="myoptions">
    <td class="label">
        <label>
            <strong>Options</strong>
        </label>
    </td>
    <td class="value">
        <div>
            <input type="radio" value="test1">
            <label>
                test1
            </label>
        </div>
        <div>
            <input type="radio" value="test1">
            <label>
                test1
            </label>
        </div>
    </td>
</tr>

如何计算此tr内的输入？有没有人能看到我能看到的例子？

Answer 1

var numberOfInputs = $(".myoptions").find("input").length

var numberOfInputs = $(".myoptions").find("input").length;

console.log(numberOfInputs);

if (numberOfInputs < 1) {
  console.log("No input");
} else if (numberOfInputs === 1) {
  console.log("One input");
} else if (numberOfInputs === 2) {
  console.log("Two inputs");
} else {
  console.log("More than two inputs");
}

<table>
  <tr class="myoptions">
    <td class="label">
      <label>
            <strong>Options</strong>
        </label>
    </td>
    <td class="value">
      <div>
        <input type="radio" value="test1">
        <label>
                test1
            </label>
      </div>
      <div>
        <input type="radio" value="test1">
        <label>
                test1
            </label>
      </div>
    </td>
  </tr>
</table>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

需要注意的一件重要事情是，由于您使用<table>，因此绝对需要<tr>元素父级，否则浏览器会从DOM中删除您的<tr>元素 - 使其无法访问

Answer 2

查找行类.value中的输入......顺便说一句，这是一个奇怪的类名。可能会令人困惑......

然后.length属性将告诉您集合中有多少。

＆＃13;

console.log( $(".value input").length );

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table>
  <tr class="myoptions">
    <td class="label">
        <label>
            <strong>Options</strong>
        </label>
    </td>
    <td class="value">
        <div>
            <input type="radio" value="test1">
            <label>
                test1
            </label>
        </div>
        <div>
            <input type="radio" value="test1">
            <label>
                test1
            </label>
        </div>
    </td>
  </tr>
</table>

＆＃13;

jQuery - 计算表行中的输入

2 个答案: