Javascript js中的多个if条件未提供所需输出
我有3个输入字段,第一个选择一部电影,第二个选择一个日期(日期随所选电影而相应变化),第三个选择运行时间。仅当前两个字段都已填充时,第三个字段才应更新。 在我当前的js代码中,我有一个if语句来检查所选的电影和日期 例如,如果选择了复仇者终局和星期三,则应显示晚上9点;如果选择了复仇者终局和星期六,则应显示下午6点。(目前只添加了这些) 问题是,在最初选择endgame和星期三后,它确实显示晚上9点,但如果我随后更改日期,到星期六它不会更新,更改为其他电影也不会更新Javascript js中的多个if条件未提供所需输出,javascript,css,if-statement,bootstrap-4,bootstrap-datepicker,Javascript,Css,If Statement,Bootstrap 4,Bootstrap Datepicker,我有3个输入字段,第一个选择一部电影,第二个选择一个日期(日期随所选电影而相应变化),第三个选择运行时间。仅当前两个字段都已填充时,第三个字段才应更新。 在我当前的js代码中,我有一个if语句来检查所选的电影和日期 例如,如果选择了复仇者终局和星期三,则应显示晚上9点;如果选择了复仇者终局和星期六,则应显示下午6点。(目前只添加了这些) 问题是,在最初选择endgame和星期三后,它确实显示晚上9点,但如果我随后更改日期,到星期六它不会更新,更改为其他电影也不会更新 /----日期----
/----日期----
变量日期=新日期();
date.setDate(date.getDate());
$(函数(){
$(“#日期选择器”)
.日期选择器({
开始日期:,
自动关闭:是的,
今天的亮点:真的
})
.datepicker(“更新”,新日期());
});
//--功能--
$(文档).ready(函数(){
var list1=document.getElementById(“selectTitle”);
列表1.options[0]=新选项(“--Select Title--”和“”);
清单1.期权[1]=新期权(“复仇者终局”,“终局”);
列表1.选项[2]=新选项(“高端婚礼”、“高端”);
清单1.期权[3]=新期权(“小飞象”、“小飞象”);
清单1.期权[4]=新期权(“快乐王子”、“快乐王子”);
});
函数getAvailableDates(){
var list1=document.getElementById(“selectTitle”);
var list2=document.getElementById(“selectTime”);
var list1SelectedValue=list1.options[list1.selectedIndex].value;
如果(list1SelectedValue==“endgame”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”[1,2]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“dumbo”){
var selectedDate=$(“#日期选择器”)。日期选择器(“getDate”);
var selectedDay=selectedDate.getDay();
document.getElementById(“demo”).innerHTML=selectedDay;
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”,[]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“happyprince”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”[1,2]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“topend”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”,[3,4,5]);
}
}
//--检测日期更改--
$(“#日期选择器”)
.datepicker()
.on(“变更日期”),功能(e){
var selectedDate=$(“#日期选择器”)。日期选择器(“getDate”);
var selectedDay=selectedDate.getDay();
var list1=document.getElementById(“selectTitle”);
var list2=document.getElementById(“selectTime”);
var list1SelectedValue=list1.options[list1.selectedIndex].value;
如果((list1SelectedValue==“endgame”)&&&(selectedDay>=3&&selectedDay*/
标签{
左边距:20px;
}
#日期选择器{
宽度:180px;
利润率:0 20px 20px 20px;
}
#日期选择器:悬停{
光标:指针;
}
/*动画边框*/
#盒子{
显示器:flex;
对齐项目:居中;
证明内容:中心;
宽度:400px;
高度:200px;
颜色:黑色;
字体系列:“雷威”;
字体大小:2.5rem;
}
.梯度边界{
--边框宽度:3倍;
背景:白色;
位置:相对位置;
边框半径:var(--边框宽度);
}
.梯度边界:之后{
内容:“;
位置:绝对位置;
顶部:计算(-1*var(-borderWidth));
左:计算(-1*var(-borderWidth));
高度:计算(100%+var(--边界宽度)*2);
宽度:计算(100%+var(--边界宽度)*2);
背景:线性梯度(60度,#f79533,#f37055,#ef4e7b,#a166ab,#5073b8,#1098ad,#07b39b,#6fba82);
边界半径:计算(2*var(--边界宽度));
z指数:-1;
动画:AnimatedGraient 3s ease alternate infinite;
背景尺寸:300%300%;
}
@关键帧动画EdgeRadient{
0% {
背景位置:0%50%;
}
50% {
背景位置:100%50%;
}
100% {
背景位置:0%50%;
}
}
h1{
宽度:自动;
保证金顶部:-5.3em;
左边距:-3em;
背景:白色;
}
.货柜箱{
显示器:flex;
柔性包装:包装;
}
如果您的情况不正常,问题已在bcoz中解决
以下是工作js代码:-
// ----Date----
var date = new Date();
date.setDate(date.getDate());
$(function() {
$("#datepicker")
.datepicker({
startDate: date,
autoclose: true,
todayHighlight: true
})
.datepicker("update", new Date());
});
// --functions--
$(document).ready(function() {
var list1 = document.getElementById("selectTitle");
list1.options[0] = new Option("--Select Title--", "");
list1.options[1] = new Option("Avengers Endgame", "endgame");
list1.options[2] = new Option("Top End Wedding", "topend");
list1.options[3] = new Option("Dumbo", "dumbo");
list1.options[4] = new Option("The Happy Prince", "happyprince");
});
function getAvailableDates() {
var list1 = document.getElementById("selectTitle");
var list2 = document.getElementById("selectTime");
var list1SelectedValue = list1.options[list1.selectedIndex].value;
if (list1SelectedValue == "endgame") {
$("#datepicker").datepicker("setDaysOfWeekDisabled", [1, 2]);
$("#datepicker").datepicker("setDate", date);
} else if (list1SelectedValue == "dumbo") {
var selectedDate = $("#datepicker").datepicker("getDate");
var selectedDay = selectedDate.getDay();
document.getElementById("demo").innerHTML = selectedDay;
$("#datepicker").datepicker("setDaysOfWeekDisabled", []);
$("#datepicker").datepicker("setDate", date);
} else if (list1SelectedValue == "happyprince") {
$("#datepicker").datepicker("setDaysOfWeekDisabled", [1, 2]);
$("#datepicker").datepicker("setDate", date);
} else if (list1SelectedValue == "topend") {
$("#datepicker").datepicker("setDaysOfWeekDisabled", [3, 4, 5]);
}
}
// --detect date change--
$("#datepicker")
.datepicker()
.on("changeDate", function(e) {
var selectedDate = $("#datepicker").datepicker("getDate");
var selectedDay = selectedDate.getDay();
var list1 = document.getElementById("selectTitle");
var list2 = document.getElementById("selectTime");
var list1SelectedValue = list1.options[list1.selectedIndex].value;
console.log(selectedDay+list1SelectedValue);
if ((list1SelectedValue == "endgame") && (selectedDay >=3 && selectedDay<=5)) {
//list2.options.length = 0;
//list2.options[0] = new Option("9PM", "T18");
$(new Option('9PM','T18')).appendTo('#selectTime');
}
if ((list1SelectedValue == "endgame") && (selectedDay==6 )) {
list2.options.length = 0;
list2.options[0] = new Option("6PM", "T18");
}
document.getElementById("demo").innerHTML = selectedDay;
});
/----日期----
变量日期=新日期();
date.setDate(date.getDate());
$(函数(){
$(“#日期选择器”)
.日期选择器({
开始日期:,
自动关闭:是的,
今天的亮点:真的
})
.datepicker(“更新”,新日期());
});
//--功能--
$(文档).ready(函数(){
var list1=document.getElementById(“selectTitle”);
列表1.options[0]=新选项(“--Select Title--”和“”);
清单1.期权[1]=新期权(“复仇者终局”,“终局”);
列表1.选项[2]=新选项(“高端婚礼”、“高端”);
清单1.期权[3]=新期权(“小飞象”、“小飞象”);
清单1.期权[4]=新期权(“快乐王子”、“快乐王子”);
});
函数getAvailableDates(){
var list1=document.getElementById(“selectTitle”);
var list2=document.getElementById(“selectTime”);
var list1SelectedValue=list1.options[list1.selectedIndex].value;
如果(list1SelectedValue==“endgame”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”[1,2]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“dumbo”){
var selectedDate=$(“#日期选择器”)。日期选择器(“getDate”);
var selectedDay=selectedDate.getDay();
document.getElementById(“demo”).innerHTML=selectedDay;
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”,[]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“happyprince”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”[1,2]);
$(“#日期选择器”)。日期选择器(“设置日期”,日期);
}else if(list1SelectedValue==“topend”){
$(“#datepicker”).datepicker(“setDaysOfWeekDisabled”,[3,4,5]);
}
}
//--检测日期更改--
$(#日期选择器)
if(selectedDay == 6)