Jquery 兄弟（）不適用於 div 內的元素

Question

我已經堅持了很長一段時間了。

我想使用 jquery 在點擊時獲取輸入字段的值，但它總是提示“未定義”

 $('.inputbox.updateAdvertiser').on('click', function() { var name = $(this).siblings('.name').val(); var adId = $(this).siblings('.adId').val(); alert(adId); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="box"> <div class="inputbox"> <input type="text" class="name" value="mark"> <label>Name</label> </div> <div class="inputbox"> <input type="text" class="adId" value="1"> <label>Userid</label> </div> <div class="inputbox"> <input type="submit" value="Update" class="updateAdvertiser"> </div> </div> <div class="box"> <div class="inputbox"> <input type="text" class="name" value="Peter"> <label>Name</label> </div> <div class="inputbox"> <input type="text" class="adId" value="2"> <label>Userid</label> </div> <div class="inputbox"> <input type="submit" value="Update" class="updateAdvertiser"> </div> </div>

Answer 1

兄弟姐妹不能在父元素之外工作

 $('.inputbox.updateAdvertiser').on('click', function() { var parent = $(this).closest('.box'); var name = parent.find('.name').val(); var adId = parent.find('.adId').val(); alert(adId); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="box"> <div class="inputbox"> <input type="text" class="name" value="mark"> <label>Name</label> </div> <div class="inputbox"> <input type="text" class="adId" value="1"> <label>Userid</label> </div> <div class="inputbox"> <input type="submit" value="Update" class="updateAdvertiser"> </div> </div> <div class="box"> <div class="inputbox"> <input type="text" class="name" value="Peter"> <label>Name</label> </div> <div class="inputbox"> <input type="text" class="adId" value="2"> <label>Userid</label> </div> <div class="inputbox"> <input type="submit" value="Update" class="updateAdvertiser"> </div> </div>