How to get value of element in JQuery

By FoxLearn 12/11/2024 10:02:19 AM   25
To get the value of an element using jQuery, you can use different methods depending on the type of element you're working with.

For example:

<form>
  <input type="text" id="myInput" value="jQuery">
  <select id="mySelect">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
  </select>
  <input type="checkbox" id="myCheckbox" checked>
</form>

<script>
  $(document).ready(function() {
    var inputValue = $('#myInput').val(); // "Hello"
    var selectedValue = $('#mySelect').val(); // "1"
    var checkboxChecked = $('#myCheckbox').prop('checked'); // true
  });
</script>

JQuery get value of element

For example, Getting the value of an input field, hidden field.

var value = $('#myInput').val();

This will get the current value of an input element with the id="myInput".

For example, Getting the value of a selected option in a dropdown.

var selectedValue = $('#mySelect').val();

This will return the value of the selected option in the dropdown.

For example, Getting the checked status of a checkbox or radio button.

var isChecked = $('#myCheckbox').prop('checked');

This will return true if the checkbox is checked, otherwise false.

For example, Getting the text of an element

var text = $('#myElement').text();

This will retrieve the text content inside the element.

For example, Getting the value of a data attribute.

var dataValue = $('#myElement').data('attribute-name');

This gets the value of a data-* attribute (for example, data-id="123").