This works fine in web browsers, but it doesn't work on mobile browsers. What am I missing here? I can only add script to the page, I can not edit the select options at all. I have seen that .val or .change doesn't work on mobile browsers but I can not find a documented fix or some basic code that works across all platforms.
$("#CallTimeRange").on('keyup change select', (function () {
var later = $('#CallTimeRange').val();
var timezone = $('#TimeZone').val();
if (later === 'select a time' || timezone ==='9') {
$('#submitSchedule').css('display', 'none');
return false;
}else{
$('#submitSchedule').css('display', 'block');
return;
}
}));
<select id="CallTimeRange" tabindex="3" name="CallTimeRange">
<option value="select a time">select a time</option>
<option value="6:00 AM-8:00 AM">6:00 AM-8:00 AM</option>
<option value="8:00 AM-10:00 AM">8:00 AM-10:00 AM</option>
<option value="10:00 AM-12:00 PM">10:00 AM-12:00 PM</option>
<option value="12:00 PM-2:00 PM">12:00 PM-2:00 PM</option>
<option value="2:00 PM-4:00 PM">2:00 PM-4:00 PM</option></select>
CodePudding user response:
It might be easier to write a script to do that using the onchange
<select onchange="myFunction()">
This way you can do it using pure html tags as per the sample below. Just make the changes to the function according to your requirements.
<script>
window.addEventListener("resize", myFunction);
function myFunction() {
var $myWidth = document.body.clientWidth;
$myWidth=($myWidth * (4 / 4));
var $myHeight= ($myWidth / (16/9)); // var myHeight="900.876976978";
$myHeight= Math.round($myHeight);
document.getElementById("Edit1").width = $myWidth -40;
document.getElementById("Edit1").height = $myHeight;
}
</script>
CodePudding user response:
Write it all in vanilla javascript worked.