doSomething
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function doSomething(){
//获取input输入的内容
var input = document.getElementById("input").value;
if(input == "red"||input =="black"||input =="blue"){
document.getElementById("output").style.color=input;
}else{
try{
var t = eval(input);
document.getElementById("output").innerText = t;
}catch(e){
document.getElementById("output").innerText = input;
}
}
}
</script>
</head>
<!-- 2)请使用Javascript代码补全doSomething ()方法,实现文本框输入内容,div根据输入内容调整的功能。
要求:
(1)当输入的内容是red,blue或black时,对应更改div中的字体颜色。
(2)当输入的内容是算数表达式时(如:2+3*5),在div中显示计算结果。
(3)当输入的内容是文字时,在div中显示这些文字。
<input type="text" id="input">
<input type="button" value="输入" onClick="doSomething();">
<div id="output">welcome</div>
-->
<input type="text" id="input">
<input type="button" value="输入" onClick="doSomething();">
<div id="output">welcome</div>
<body>
</body>
</html>
购物车
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
// confirm("44")
function sum(){
var chone = document.getElementsByName("chkone");
var money = document.getElementsByName("each_money");
var summ = 0;
for(var i = 0;i<chone.length;i++){
if(chone[i].checked){
summ+=Number(money[i].value);
}
}
//.toFixed(2)小数保留两位
document.getElementById("total").value = summ.toFixed(2);
}
</script>
</head>
<body>
<form>
<table border="1" width="400" cellpadding="0" cellspacing="0">
<tr>
<td width="50">金额</td>
<td></td>
<td>是否求和</td>
</tr>
<tr>
<td width="50"><input type="text" name="each_money"/></td>
<td></td>
<td><input type="checkbox" name="chkone"/></td>
</tr>
<tr>
<td width="50"><input type="text" name="each_money"/></td>
<td></td>
<td><input type="checkbox" name="chkone"/></td>
</tr>
<tr>
<td width="50"><input type="text" id="total" readonly="readonly" /></td>
<td>金额合计</td>
<td><input type="button" onclick="sum();" value="求和"/></td>
</tr>
</table>
</form>
</body>
</html>
几秒后跳转
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function go(){
window.location.href="https://www.baidu.com";
}
window.onload = function(){
var num = document.getElementById("t").value;
setTimeout(go(),num);
}
</script>
</head>
<body>
<input type="text" name="t" id="t" value="3" />
</body>
</html>
全选
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function all1(){
// alert("234");
var all = document.getElementById("all");
var qx = document.getElementsByName("qx");
for(var i = 0;i<qx.length;i++){
qx[i].checked=all.checked;
}
}
function one(){
// alert("wer");
var all = document.getElementById("all");
var qx = document.getElementsByName("qx");
var count = 0;
for(var i = 0;i<qx.length;i++){
if(!qx[i].checked){
all.checked=false;
}else{
count++;
}
}
if(qx.length==count){
all.checked = true;
}
/* if(count==qx.length){
all.checked=true;
}else{
all.checked=false;
} */
}
</script>
</head>
<body>
<input type="checkbox" name="all" id="all" onclick="all1();" />全选
<table border="1px" cellspacing="0" cellpadding="0">
<tr><th><input type="checkbox" name="qx" id="qx" value="1" onclick="one();"/></th><td>用户1</td></tr>
<tr><th><input type="checkbox" name="qx" id="qx" value="2" onclick="one();"/></th><td>用户2</td></tr>
</table>
</body>
</html>
城市联动
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
var province = new Array();
province[0] = "辽宁";
province[1] = "吉林";
var citys = new Array();
citys[0] = new Array();
citys[1] = new Array();
citys[0][0] = "沈阳";
citys[0][1] = "朝阳";
citys[0][2] = "鞍山";
citys[1][0] = "吉林";
citys[1][1] = "太原";
function showCity(){
// alert("加载时");
//获取用户选择哪个省
var provinces = document.getElementById("province");
var city = document.getElementById("city");
//所选城市下标的索引值
var index = provinces.selectedIndex - 1;
//读取s该省的城市信息
//为了解决选项重复添加的问题,需要在每次添加前先清空city下拉列表框
city.options.length=0;
for(var i = 0 ;i<citys[index].length;i++){
//放到下拉列表中
city.options.add(new Option(citys[index][i],Number(""+index+""+i)));
}
}
</script>
</head>
<body>
省份:<select name="province" id="province" onchange="showCity()">
<option value ="">请选择省</option>
<script type="text/javascript">
for(var i in province){
document.write("<option value ='"+i+"'>"+province[i]+"</option>");
}
</script>
</select>
城市:<select name="city" id="city">
<option value ="">请选择城市</option>]
</select>
</body>
</html>