jQuery-在每個循環中查找下一個元素

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個值，則在此處編碼

否則，您要顯示4個值，可以編寫以下代碼：

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

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