<!DOCTYPE>
<html>
??<head>
????<meta?charset="utf-8">
????<title>IFE?JavaScript?Task?01</title>
????<script?src="task.js"></script>
??</head>
<body>
??<div>
????<label>城市名稱:<input?id="aqi-city-input"?type="text"></label><br>
????<label>空氣質(zhì)量指數(shù):<input?id="aqi-value-input"?type="text"></label><br>
????<button?id="add-btn">確認添加</button>
??</div>
??<table?id="aqi-table">
??<!--?
????<tr>
??????<td>城市</td><td>空氣質(zhì)量</td><td>操作</td>
????</tr>
????<tr>
??????<td>北京</td><td>90</td><td><button>刪除</button></td>
????</tr>
????<tr>
??????<td>北京</td><td>90</td><td><button>刪除</button></td>
????</tr>
???-->
??</table>
</body>
</html>task.js/**
?*?aqiData,存儲用戶輸入的空氣指數(shù)數(shù)據(jù)
?*?示例格式:
?*?aqiData?=?{
?*????"北京":?90,
?*????"上海":?40
?*?};
?*/
var?aqiData?=?{};
/**
?*?從用戶輸入中獲取數(shù)據(jù),向aqiData中增加一條數(shù)據(jù)
?*?然后渲染aqi-list列表,增加新增的數(shù)據(jù)
?*/
function?addAqiData()?{
}
/**
?*?渲染aqi-table表格
?*/
function?renderAqiList()?{
}
/**
?*?點擊add-btn時的處理邏輯
?*?獲取用戶輸入,更新數(shù)據(jù),并進行頁面呈現(xiàn)的更新
?*/
function?addBtnHandle()?{
??addAqiData();
??renderAqiList();
}
/**
?*?點擊各個刪除按鈕的時候的處理邏輯
?*?獲取哪個城市數(shù)據(jù)被刪,刪除數(shù)據(jù),更新表格顯示
?*/
function?delBtnHandle()?{
??//?do?sth.
??renderAqiList();
}
function?init()?{
??//?在這下面給add-btn綁定一個點擊事件,點擊時觸發(fā)addBtnHandle函數(shù)
??//?想辦法給aqi-table中的所有刪除按鈕綁定事件,觸發(fā)delBtnHandle函數(shù)
}
init();用戶輸入的城市名必須為中英文字符,空氣質(zhì)量指數(shù)必須為整數(shù)用戶輸入的城市名字和空氣質(zhì)量指數(shù)需要進行前后去空格及空字符處理(trim)用戶輸入不合規(guī)格時,需要給出提示(允許用alert,也可以自行定義提示方式)用戶可以點擊表格列中的“刪除”按鈕,刪掉那一行的數(shù)據(jù)還是貼代碼,謝謝
做題啦做題啦
西蘭花偉大炮
2017-04-19 12:42:41