我不太擅长JQuery。我只需要添加一个"；添加"；以及"；删除"；行到表单，以在酒店中创建房间阵列。试图调整在互联网上找到的代码，我得到了以下代码：
<html>
<header>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(function() {
$("#add").click(function() {
div = document.createElement('div');
$(div).addClass("room").html("new Room Type");
$("#roomTypes").append(div);
});
});
</script>
<style>
#container {border: 1px solid red; padding: 10px; width: 100%;}
.inner {border: 1px solid green; margin: 10px; width: auto; height: 20px;}
</style>
</header>
<body>
<h1>Numbers Project</h1>
<p>Version 0.1</p>
<form>
Hotel Name: <input type="text" name="Name" value="Roma Nord"><br>
Hotel Stars: <input type="number" name="Stars" value="3"><br>
<div id="roomTypes">
<div class="room">
Room Type: <input type="text" name="RoomType" value="Double"><br>
</div>
</div>
<button id="add">Add new div</button>
Opening Date: <input type="date" name="OpenDate" value="2021-01-01"><br>
Closing Date: <input type="date" name="CloseDate" value="2021-06-30"><br>
<h3>Previous Year Data</h3>
Rooms sold: <input type="number" name="RoomsSold" value="12000"><br>
Arrivals Presences: <input type="number" name="ArrivalsPresences" value="15000"><br>
Presences: <input type="number" name="Presences" value="23000"><br>
<br><input type="submit" value="Submit">
</form>
</body>
</html>
但按钮只显示新的Div一秒钟，然后它就消失了。线路：
<button id="add">Add new div</button>
只有当我把它从形式中(在身体中(放出来时才有效。有人能帮我加这些按钮吗？谢谢你抽出时间。
要防止form提交并重新加载页面，只需添加
<button id="add" type="button">Add new div</button>
你的完整代码工作：
$(function() {
$("#add").click(function() {
div = document.createElement('div');
$(div).addClass("room").html("new Room Type");
$("#roomTypes").append(div);
});
});#container {border: 1px solid red; padding: 10px; width: 100%;}
.inner {border: 1px solid green; margin: 10px; width: auto; height: 20px;}<html>
<header>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.0.min.js"></script>
</header>
<body>
<h1>Numbers Project</h1>
<p>Version 0.1</p>
<form>
Hotel Name: <input type="text" name="Name" value="Roma Nord"><br>
Hotel Stars: <input type="number" name="Stars" value="3"><br>
<div id="roomTypes">
<div class="room">
Room Type: <input type="text" name="RoomType" value="Double"><br>
</div>
</div>
<button id="add" type='button'>Add new div</button>
Opening Date: <input type="date" name="OpenDate" value="2021-01-01"><br>
Closing Date: <input type="date" name="CloseDate" value="2021-06-30"><br>
<h3>Previous Year Data</h3>
Rooms sold: <input type="number" name="RoomsSold" value="12000"><br>
Arrivals Presences: <input type="number" name="ArrivalsPresences" value="15000"><br>
Presences: <input type="number" name="Presences" value="23000"><br>
<br><input type="submit" value="Submit">
</form>
</body>
</html>