Question

我有一个类似的问题。

我有HTML结构：

<form id="form">
    <div class="row">
        <div class="item-input">
            <label for="A1">A1</label>
            <input type="text" name ="A1" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter A1)</span>
        </div>
        <div class="item-input">
            <label for="A2">A2</label>
            <input type="text" name ="A2" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter A2)</span>
        </div>
    </div>
    <div class="row">
        <div class="item-input">
            <label for="B1">B1</label>
            <input type="text" name ="B1" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter B1)</span>
        </div>
        <div class="item-input">
            <label for="B2">B2</label>
            <input type="text" name ="B2" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter B2)</span>
        </div>
    </div>
    ...
</form>

现在我想选择'span'，每个输入[type = text]后面都有类“info”。我试试：

<script type="text/javascript"> 
    $(document).ready(function() {
        $("#form input[type=text]").each(function(){
            var spanInfo = $(this).closest("item-input").next().find('span.info');

            console.log(spanInfo.text()); // Result is empty
        });
    });
</script>

为什么是空的？请帮帮我。我怎么样，谢谢

Answer 1

var spanInfo = $(this).closest("item-input").next().find('span.info');

应该是

var spanInfo = $(this).closest(".item-input").next().find('span.info');

你错过了。（点，类）

Answer 2

您的意思是显示“（输入A2）”和“（输入B2）”或显示所有4个元素值:(输入A1），（输入A2），（输入B1），（输入B2）

如果仅显示2个值，则CODE HERE

否则你想要显示4个值，你可以编码：

$(document).ready(function() {
    $("#form input[type=text]").each(function(){
        var spanInfo = $(this).closest(".item-input").find('span.info');

        console.log(spanInfo.text()); 
    });
});

Jquery - 在每个循环中查找下一个元素

2 个答案: