我正在尝试创建一个使用fomandic UI的表单，但它不起作用，日历和下拉列表在点击时没有响应，我已经下载了语义UI zip文件并将它们包含在我的表单页面中，但它没有响应，这里缺少什么，我将非常感谢您在这方面的帮助。
<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<link rel="stylesheet" type="text/css" href="../resources/assets/Semantic-UI-CSS-master/semantic.css">
<link href="https://fonts.googleapis.com/css2?family=Mitr:wght@500&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="../resources/css/biodata.css">
</head>
<body>
<div class="ui blue inverted borderless menu">
<a class="active item">
Home
</a>
<div class="right menu">
<a class="item">
Login
</a>
<a class="item">
Sign Up
</a>
<a class="item">
Sign Out
</a>
</div>
</div>
<div class="container centered" id="datacontainer">
<form class="ui form" id="dataform">
<div class="ui card">
<div class="image" id="image-1">
<img src="C:UsersABCPicturespicture-1.jpg">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>First Name</label> </span>
<input class="forminclass" type="text" name="first-name" placeholder="First Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Last Name</label> </span>
<input class="forminclass" type="text" name="last-name" placeholder="Last Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Email</label></span>
<input class="forminclass" type="text" name="email" placeholder="Email">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Phone</label></span>
<input class="forminclass" type="text" name="phone" placeholder="Phone">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Gender</label> </span>
<div class="ui selection dropdown">
<input class="forminclass" type="hidden" name="gender">
<i class="dropdown icon"></i>
<div class="default text">Gender</div>
<div class="menu">
<div class="item" data-value="1">Male</div>
<div class="item" data-value="0">Female</div>
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Date of Birth</label> </span>
<div class="ui calendar" id="example1">
<div class="ui input left icon">
<i class="calendar icon"></i>
<input id="dob"type="text">
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Text</label> </span>
<textarea id="areat" rows="2"></textarea>
</div>
</div>
<button class="ui green button" id="edit" type="submit">Edit</button>
<button class="ui flex primary button" id="save" type="submit">Save</button>
</form>
</div>
<script
src="https://code.jquery.com/jquery-3.5.0.js"
integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc="
crossorigin="anonymous"></script>
<script type="text/javascript" src="../resources/assets/Semantic-UI-CSS-master/semantic.min.js"></script>
</body>
</html>这是我的HTML。
<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<link rel="stylesheet" type="text/css" href="../resources/assets/Semantic-UI-CSS-master/semantic.css">
<link href="https://fonts.googleapis.com/css2?family=Mitr:wght@500&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="../resources/css/biodata.css">
</head>
<body>
<div class="ui blue inverted borderless menu">
<a class="active item">
Home
</a>
<div class="right menu">
<a class="item">
Login
</a>
<a class="item">
Sign Up
</a>
<a class="item">
Sign Out
</a>
</div>
</div>
<div class="container centered" id="datacontainer">
<form class="ui form" id="dataform">
<div class="ui card">
<div class="image" id="image-1">
<img src="C:UsersABCPicturespicture-1.jpg">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>First Name</label> </span>
<input class="forminclass" type="text" name="first-name" placeholder="First Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Last Name</label> </span>
<input class="forminclass" type="text" name="last-name" placeholder="Last Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Email</label></span>
<input class="forminclass" type="text" name="email" placeholder="Email">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Phone</label></span>
<input class="forminclass" type="text" name="phone" placeholder="Phone">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Gender</label> </span>
<div class="ui selection dropdown">
<input class="forminclass" type="hidden" name="gender">
<i class="dropdown icon"></i>
<div class="default text">Gender</div>
<div class="menu">
<div class="item" data-value="1">Male</div>
<div class="item" data-value="0">Female</div>
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Date of Birth</label> </span>
<div class="ui calendar" id="example1">
<div class="ui input left icon">
<i class="calendar icon"></i>
<input id="dob"type="text">
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Text</label> </span>
<textarea id="areat" rows="2"></textarea>
</div>
</div>
<button class="ui green button" id="edit" type="submit">Edit</button>
<button class="ui flex primary button" id="save" type="submit">Save</button>
</form>
</div>
<script
src="https://code.jquery.com/jquery-3.5.0.js"
integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc="
crossorigin="anonymous"></script>
<script type="text/javascript" src="../resources/assets/Semantic-UI-CSS-master/semantic.min.js"></script>
</body>
</html>
希望这会有所帮助。CSS和js文件的位置不正确。
<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Mitr:wght@500&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="../resources/css/biodata.css">
</head>
<body>
<div class="ui blue inverted borderless menu">
<a class="active item">
Home
</a>
<div class="right menu">
<a class="item">
Login
</a>
<a class="item">
Sign Up
</a>
<a class="item">
Sign Out
</a>
</div>
</div>
<div class="container centered" id="datacontainer">
<form class="ui form" id="dataform">
<div class="ui card">
<div class="image" id="image-1">
<img src="C:UsersABCPicturespicture-1.jpg">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>First Name</label> </span>
<input class="forminclass" type="text" name="first-name" placeholder="First Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Last Name</label> </span>
<input class="forminclass" type="text" name="last-name" placeholder="Last Name">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Email</label></span>
<input class="forminclass" type="text" name="email" placeholder="Email">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Phone</label></span>
<input class="forminclass" type="text" name="phone" placeholder="Phone">
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Gender</label> </span>
<div class="ui selection dropdown">
<input class="forminclass" type="hidden" name="gender">
<i class="dropdown icon"></i>
<div class="default text">Gender</div>
<div class="menu">
<div class="item" data-value="1">Male</div>
<div class="item" data-value="0">Female</div>
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Date of Birth</label> </span>
<div class="ui calendar" id="example1">
<div class="ui input left icon">
<i class="calendar icon"></i>
<input id="dob"type="text">
</div>
</div>
</div>
</div>
<div class="field">
<div class="inline fields">
<span class="indataform"> <label>Text</label> </span>
<textarea id="areat" rows="2"></textarea>
</div>
</div>
<button class="ui green button" id="edit" type="submit">Edit</button>
<button class="ui flex primary button" id="save" type="submit">Save</button>
</form>
</div>
</body>
</html>