I've written a form that contains HTML select served by jQuery. The rest of HTML elements is served by pure Javascript. I want to get in Javascript part the value obtaied from jQuery block. Here is a simple code which covers the subject:
<!DOCTYPE html><html>
<head><meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#button").click(function() {
var value = $("#city").val();
alert(value);
})
});
//how to get value from jQuery block above ? ?
var pure_value = value;
. . . . . . . . . . . . //the next code using value
</script>
</head>
<body> Select City:
<select id="city" name="city">
<option value="delhi"> Delhi </option>
<option value="mumbai"> Mumbai </option>
<option value="chennai"> Chennai </option>
</select>
<button id="button"> Fetch Value </button>
</body>
</html>
var value will only have a city value when the user clicks the button, so it does not make sense to try to get the value from the variable declared inside button click callback.
You have some possibilities:
var pure_value = $("#city").val();