JQuery Scroll Limit to Span Text
تبليغسؤال
يرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
Firstly please excuse my knowledge of JQuery im a total noob and struggline to get this code to work.
I did try a search but could not find a solution for my issue.
Ok so I have a little scroll bar which allows the user to select a tempo from 40 to 300 bpm
these are the limits I have set for the slider.
Under the slider is a text input box so people can just enter the bpm manually example: 121
If the number entered is lower or highr then the limites meantioned above, I need to set the Span text to the lower or higher limit (example 40 lower limit and 300 max limit)
I also need 2 outputs updating at the same time: one is the text input field and the other is a span
here is the code I have
$(‘#BPMRange’)
.on(‘input’, function() {
var value = $(this).val();
$(‘#Test’).text(value);
})
.on(‘input’, function() {
var value = $(this).val();
$(‘#Test’).text(value);
})
$(‘#BPM’)
.keyup(function() {
var value = $(this).val();
$(‘#Test’).text(value);
})
.keyup();
$(‘#BPM’).on(‘change blur’, function() {
if ($(this).val().trim().length === 0) {
$(this).val($default_BPM);
var value = $(this).val();
}
if ($(this).val() < 40) {
$(‘#Test’).text(’40’);
} else if ($(this).val() > 300) {
$(‘#Test’).text(‘300’);
}
})
<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>
<div class=”BPM_Slide_Container”>
<input type=”range” min=”40″ max=”300″ value=”300″ class=”BPM_Slider” id=”BPMRange”>
<br>
<input name=”BPM” type=”text” id=”BPM” value=”300″ class=”TempoField”>
</div>
<span id=”Test”></span>
Thank you for any advice you can share – I do appreciate it
أضف إجابة