用两个按钮来控制input type="text"中文字的大小和颜色谁能帮帮忙？

oKongDaoKongXin 2014-10-11 08:56:54

求大神支招这是大概的效果图

...全文

149 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

zebro1573 2014-10-12

打赏
举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<input type="text" id="test" /><br/>
<select onchange="changeStyle(this)">
	<option value="red">红色</option>
    <option value="green">绿色</option>
</select>
<select onchange="changeStyle(this)">
	<option value="20px">20px</option>
    <option value="30px">30px</option>
</select>
<script type="text/javascript">
	var t=document.getElementById('test');
	function changeStyle(th){
		var value=th.value;
		/^[a-z]+$/.test(value)?t.style.color=value:t.style.fontSize=value;
		
	}
</script>
</body>
</html>

[/quote]

似梦飞花 2014-10-12

打赏
举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<input type="text" id="test" /><br/>
<select onchange="changeStyle(this)">
	<option value="red">红色</option>
    <option value="green">绿色</option>
</select>
<select onchange="changeStyle(this)">
	<option value="20px">20px</option>
    <option value="30px">30px</option>
</select>
<script type="text/javascript">
	var t=document.getElementById('test');
	function changeStyle(th){
		var value=th.value;
		/^[a-z]+$/.test(value)?t.style.color=value:t.style.fontSize=value;
		
	}
</script>
</body>
</html>