تعیین رنگ پس زمینه جدول با استفاده از combo box

hamidhmd

New Member
تعیین رنگ پس زمینه جدول با استفاده از combo box سلام
من می خواهم با انتخاب رنگ از منوی باز شونده و انتخاب رنگ که توسط کاربر انجام می شود رنگ پس زمینه جدولم تغییر کند

به مشکل خوردم لطفا یکی کمک کنه:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#myt tr{
background-color:#fff;
}
</style>
<script type="text/javascript">
function fg()
{

var colo = document.getElementById("myc");

alert(colo)
}
if(colo==1)

myt.style.backgroundColor='red';
else if(colo==2)
myt.style.backgroundColor='blue';

else if(colo==3)
myt.style.backgroundColor='green';
}
window.onload = fg();
</script>
</head>

<body>
<table border=1 id="myt">
<tr>
<td>a1</td>
<td>a2</td>
<td>a3</td>
</tr>
<tr>
<td>b1</td>
<td>b2</td>
<td>b3</td>
</tr>
</table><hr>
<form name="f1">
<select name=myc>
<option value=1 onclick="fg(document.f1.myc.value)">red
<option value=2 onclick="fg(document.f1.myc.value)">blue
<option value=3 onclick="fg(document.f1.myc.value)">green
</select>
</form>
</body
 

mo.esmp

Member
کد:
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>a1</title>
<script type="text/javascript">
	function fg(){
		var selection = document.getElementById("myc");
        //switch(selection.selectedIndex)
		switch(selection.selectedIndex){
		  case 0:
            document.getElementById("tbl").style.backgroundColor = "red";
            break;
          case 1:
            document.getElementById("tbl").style.backgroundColor = "blue";
            break;
          case 2:
            document.getElementById("tbl").style.backgroundColor = "green";
            break;
		}
	}
</script>
</head>

<body onload="fg()">
	<table border="1" id="tbl">
		<tr>
			<td>a1</td>
			<td>a2</td>
			<td>a3</td>
		</tr>
		<tr>
			<td>b1</td>
			<td>b2</td>
			<td>b3</td>
		</tr>
	</table>
	<hr />
	<form name="f1">
		<select id="myc">
			<option value="1" onmouseup="fg()">red</option>
			<option value="2" onmouseup="fg()">blue</option>
			<option value="3" onmouseup="fg()">green</option>
		</select>
	</form>
</body>

</html>
البته رویداد onmouseup برای کنترل select در فایرفاکس کار میکنه ولی در IE کار نمیکنه. برای حل این مشکل میتونی از یک کنترل button استفاده کنی و تابع fg رو فراخونی کنی.
 

جدیدترین ارسال ها

بالا