Javascript JQuery UI对话框是否正确显示

我创建了一个验证来检查一个人是否小于18岁。如果此人未满18岁，将打开一个对话框。我正在使用jQueryUI对话框来执行此操作，但是对话框看起来很混乱（见图）。我不知道我做错了什么。如何使对话框正确显示

函数myFunction（）{
今天=新日期（）；
todayYear=today.getFullYear（）；
todayMonth=today.getMonth（）；
todayDay=today.getDay（）；
var x=document.getElementById（“DOB”）.value；
出生日期=新日期（x）；
生日=生日。getFullYear（）；
birthMonth=birthDate.getMonth（）；
生日=生日。getDay（）；
年龄=今天年-出生年；
如果（今天月<出生月-1）{
年龄--；
}
if（年龄<18岁）{
$（函数（）{
$（''）。对话框({
莫代尔：是的，
标题：“年龄检查？”，
打开：函数（）{
var标记='申请人未满18岁。是否继续？'；
$（this）.html（标记）；
},
按钮：{
“确认”：函数（）{
$（this.dialog（'close'）；
},
“更改”：函数（）{
$（'#DOB'）.val（''）；
$（this.dialog（'close'）；
}
}
});
} );  
}
}

缺少jquery ui.css

函数myFunction（）{
今天=新日期（）；
todayYear=today.getFullYear（）；
todayMonth=today.getMonth（）；
todayDay=today.getDay（）；
var x=document.getElementById（“DOB”）.value；
出生日期=新日期（x）；
生日=生日。getFullYear（）；
birthMonth=birthDate.getMonth（）；
生日=生日。getDay（）；
年龄=今天年-出生年；
如果（今天月<出生月-1）{
年龄--；
}
if（年龄<18岁）{
$（函数（）{
$（''）。对话框({
莫代尔：是的，
标题：“年龄检查？”，
打开：函数（）{
var标记='申请人未满18岁。是否继续？'；
$（this）.html（标记）；
},
按钮：{
“确认”：函数（）{
$（this.dialog（'close'）；
},
“更改”：函数（）{
$（'#DOB'）.val（''）；
$（this.dialog（'close'）；
}
}
});
} );  
}
}

你的日期选择器甚至不工作。如果导入
，则无需再次导入
。不管怎样，你想打开一个模式对话框吗？你知道为什么代码可以在线工作吗？例如，如果我使用JFIDLE，我会看到对话框，验证工作正常。但是我在本地打开的代码不起作用。我甚至看不到对话框出现。只需包含
jqueryui.css
。检查本地的
html
，它抱怨在引用的开头添加了额外的https://。谢谢，这很有效。