一个table中有一个下拉选内容是不同的颜色如何用JS实现点一个颜色整个table换颜色
<tr><td>皮肤:</td><td><select><optionvalue="yellow">红黄系</option><optionvalue="red">青粉系<...
<tr>
<td>皮肤:</td>
<td>
<select >
<option value="yellow">红黄系</option>
<option value="red">青粉系</option>
<option value="green">绿紫系</option>
</select>
</td>
</tr>
怎么样选择红黄系,然后整个表格奇数行是红色,偶数行是黄色,选青粉系,奇数行是青色,偶数行是粉色,给出代码,用JS,我是初学者,别太复杂,给个注释就更好了 展开
<td>皮肤:</td>
<td>
<select >
<option value="yellow">红黄系</option>
<option value="red">青粉系</option>
<option value="green">绿紫系</option>
</select>
</td>
</tr>
怎么样选择红黄系,然后整个表格奇数行是红色,偶数行是黄色,选青粉系,奇数行是青色,偶数行是粉色,给出代码,用JS,我是初学者,别太复杂,给个注释就更好了 展开
展开全部
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/huanfu0.css" id="link"/>
<title>换肤功能</title>
</head>
<body>
<input type="radio" name="1" value="1" placeholder="">
<input type="radio" name="1" value="2" placeholder="">
</body>
<script type="text/javascript">
var linkHref = document.getElementById("link"),//获取link标签对象
btn = document.getElementsByTagName("input"),
ls = localStorage;//创建一个本地存储的变量名
if(ls.getItem("indexStyle")){
linkHref.href = "css/huanfu" + ls.getItem("indexStyle") + ".css";//修改link标签的href属性值
}
ls.setItem("css1","css/huanfu1.css");
ls.setItem("css2","css/huanfu2.css");//把修改的样式存在本地存储里面。下次点开的时候读取样式
for (var i = 0; i < btn.length; i++) {
btn[i].index = i;
btn[i].onclick = function(){
linkHref.href = ls.getItem(ls.key(this.index));
ls.setItem("indexStyle",this.index+1);
}
};
</script>
</html>
我用的是radio标签。初始化的样式是css/huanfu0.css。点击一个之后换成另一个。
自此之前。你先去了解一下本地存储的使用。要是不要有关掉页面还能保存选中样式的话,就只要黑link一个id。然后修改他的href属性就好了。
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/huanfu0.css" id="link"/>
<title>换肤功能</title>
</head>
<body>
<input type="radio" name="1" value="1" placeholder="">
<input type="radio" name="1" value="2" placeholder="">
</body>
<script type="text/javascript">
var linkHref = document.getElementById("link"),//获取link标签对象
btn = document.getElementsByTagName("input"),
ls = localStorage;//创建一个本地存储的变量名
if(ls.getItem("indexStyle")){
linkHref.href = "css/huanfu" + ls.getItem("indexStyle") + ".css";//修改link标签的href属性值
}
ls.setItem("css1","css/huanfu1.css");
ls.setItem("css2","css/huanfu2.css");//把修改的样式存在本地存储里面。下次点开的时候读取样式
for (var i = 0; i < btn.length; i++) {
btn[i].index = i;
btn[i].onclick = function(){
linkHref.href = ls.getItem(ls.key(this.index));
ls.setItem("indexStyle",this.index+1);
}
};
</script>
</html>
我用的是radio标签。初始化的样式是css/huanfu0.css。点击一个之后换成另一个。
自此之前。你先去了解一下本地存储的使用。要是不要有关掉页面还能保存选中样式的话,就只要黑link一个id。然后修改他的href属性就好了。
展开全部
window.onload = function ()
{
var table = document.getElementsByTagName ('table')[0];
var sels = document.getElementsByTagName ('select')[0];
sels.onchange = function ()
{
for ( var j = 0; j < table.rows.length; j++)
{
table.rows[j].style.backgroundColor = j % 2 == 0 ? colors[this.selectedIndex][0] : colors[this.selectedIndex][1];
}
}
}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询