دریافت مقدار input در جاوااسکریپت

برای دریافت و استفاده از مقدار وارد شده در فیلد input می‌توانیم از روش‌های زیر استفاده کنیم:

۱- با استفاده از کدهای جاوااسکریپت

<input type="text" id="my-field">

<script>
    let value = document.querySelector( '#my-field' ).value;
    alert( value );
</script>

۲- با استفاده از کدهای جاوااسکریپت - روش قدیمی‌تر

<input type="text" id="my-field">

<script>
    let value = document.getElementById( 'my-field' ).value;
    alert( value );
</script>

دقت کنید که در این روش علامت Number Sign یا Hash قبل از شناسه‌ی فیلد وجود ندارد.

۳- با استفاده از jQuery

<input type="text" id="my-field">

<script>
    let value = $( '#my-field' ).val();
    alert( value );
</script>

توجه به این نکته ضروری است که کدهای مربوط به jQuery برای تمام نوع فیلدها قابل استفاده هستند. فیلدهایی مثل select و textarea را هم شامل می‌شوند ولی کدهای جاوااسکریپت فقط برای فیلدهایی که صفت value داشته باشند قابل استفاده است و برای سایر انواع فیلدها به کدهای بیشتری نیاز است.

انواع متداول فیلد input که دارای value است شامل text و hidden و checkbox و radio هستند. همچنین انواع جدیدتر مثل url و email هم این ویژگی را دارا می‌باشند.