如何使用javascript或jquery獲取這些輸入的值

Question

我想知道是否可以通過最接近的元素找到輸入？ 真實代碼：

<form method="post" action="">
    <div class="rocket-form">
        <fieldset>
            <legend>Person Contacts</legend>
        </fieldset>

        <div class="rocket-label-element no-height">
            <dt id="id-label">&nbsp;</dt>
            <dd id="id-element">
                <input type="hidden" name="id" value="" readonly="readonly" id="id">
            </dd>
        </div>
        <div class="rocket-label-element no-height"><dt id="vendor_id-label">&nbsp;</dt>
            <dd id="vendor_id-element">
                <input type="hidden" name="vendor_id" value="" readonly="readonly" id="vendor_id">
            </dd>
        </div>
        <div class="rocket-label-element">
            <div id="firstname-label">
                <label for="firstname" class="rocket-label optional">First name</label>
            </div>
            <div class="rocket-element">
                <input type="text" name="firstname" id="firstname" value="any first name" maxlength="64" readonly="readonly">
            </div>
        </div>
        <div class="rocket-label-element">
            <div id="lastname-label">
                <label for="lastname" class="rocket-label optional">Last name</label>
            </div>
            <div class="rocket-element">
                <input type="text" name="lastname" id="lastname" value="any last name" maxlength="64" readonly="readonly">
            </div>
        </div>
        <div class="rocket-label-element">
            <div id="phone-label">
                <label for="phone" class="rocket-label optional">Phone</label>
            </div>
            <div class="rocket-element">
                <input type="text" name="phone" id="phone" value="0123456789" maxlength="32" readonly="readonly">
            </div>
        </div>
        <div class="rocket-label-element">
            <div id="email-label">
                <label for="email" class="rocket-label optional">Email</label>
            </div>
            <div class="rocket-element">
                <input type="text" name="email" id="email" value="name@someMail.com" maxlength="128" readonly="readonly">
            </div>
        </div>
    </div>
</form>

我有這種形式，我想獲取變量中輸入的值。我嘗試使用“ vendor_id”以便使用closest（）或next（）或prev（），但是沒有運氣..因此，任何幫助？

Answer 1

您可以使用

var vendorId = $("#vendor_id").val();

獲取vendor_id的值。

確保包含將其標識為ID的＃ 。

如果要獲取所有輸入的值，可以使用：

$("input, select, textarea").each(function(){
    // Get value of inputs
});

如果您有多個表格，則可以使用：

var formData = $(".rocket-form").closest("form").serialize();

請記住，您將需要在jQuery中添加一個script標簽，並且應該像這樣包裝代碼：

$(function() {
    console.log( "ready!" );
});

這樣可以確保在執行JavaScript之前頁面已准備就緒。

Answer 2

不知道我是否完全理解您的要求，但那又如何

$('#vendor_id-element input').val()

Answer 3

嘗試這個

var inputs = $('form').find('input');
//inputs is the array of your inputs and values can be accessed by:
var value1 = $(inputs[0]).val();

//or you can use for loop or forEach
for (var i = 0; i < inputs.length; i++) {
    var currentValue = $(inputs[i]).val();
    alert(currentValue);

}

Answer 4

您想要獲取價值的所有輸入中的一個類，並遵循js

  Array.prototype.slice.apply(document.querySelector('.your-input-class')).forEach(function(el){
       Console.log(el.value);
    });

Answer 5

你可以試試這個

var form = $("#vendor_id").closest("form").get();
$("form :input").each(function(){
 var input = $(this);
 var AllInputValues= $(input).val();
 alert (AllInputValues);

});

編輯

var theVendform = $("#vendor_id").parent().closest("form").get();
                alert(theVendform["0"][3].defaultValue);
                alert(theVendform["0"][4].defaultValue);
                alert(theVendform["0"][5].defaultValue);
                alert(theVendform["0"][6].defaultValue);