مشکل در اجرای کد جاوا اسکریپت
سلام دوستان
میخواستم مشکل این کد چیه که اجرا نمیشه...دو تا سلول داریم یکی قرمز و دیگری آبی.کدی که نوشته با اجرای آن وقتی که هر بار روی دکمه کلیک میکنیم باید رنگ سلول ها عوض شه...اگه میشه بگید مشکل کد کجاست و چطوری میشه درستش کرد......در ضمن اگر نرم افزاری میشناسید که کد های جاوا اسکریپت رو مرحله به مرحله اجرا کنه و نشون بده تا بشه مشکل رو پیدا کرد اگه یه همچین برنامه ای میشناسین بگید دمتون گرم
کد HTML:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>XO</title>
<style>
table {
border-collapse:collapse;
}
td {
text-align:center;
height:20px;
width:40px;
border:1px solid black;
}
#td1 {
background-color:red;
}
#td2 {
background-color:blue;
}
</style>
<script>
function show() {
var a = 1;
if (a == 2) {
var td1 = document.getElementById('td1');
td1.style.backgroundColor = "blue";
var td2 = document.getElementById('td2');
td2.style.backgroundColor = "red";
a = 2;
};
if (a == 2) {
var td1 = document.getElementById('td1');
td1.style.backgroundColor = "red";
var td2 = document.getElementById('td2');
td2.style.backgroundColor = "blue";
a = 1;
};
}
</script>
</head>
<body>
<h1 id="hd">Test</h1>
<table id="tab">
<tr>
<td id="td1"> 1 </td><td id="td2"> 2 </td>
</tr>
</table>
<input type="button" value="Click" id="b1" onclick="show();" />
</body>
</html>
پاسخ : مشکل در اجرای کد جاوا اسکریپت
کد HTML:
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>XO</title> <style> table { border-collapse:collapse; }
td { text-align:center; height:20px; width:40px; border:1px solid black; } #td1 { background-color:red; } #td2 { background-color:blue; }
</style> <script>
var a = 1; function show() { if (a == 1) { var td1 = document.getElementById('td1'); td1.style.backgroundColor = "blue"; var td2 = document.getElementById('td2'); td2.style.backgroundColor = "red"; } if (a == 2) { var td1 = document.getElementById('td1'); td1.style.backgroundColor = "red"; var td2 = document.getElementById('td2'); td2.style.backgroundColor = "blue";
}
} </script></head><body>
<h1 id="hd">Test</h1> <table id="tab"> <tr> <td id="td1"> 1 </td><td id="td2"> 2 </td> </tr>
</table>
<input type="button" value="Click" id="b1" onClick="show(a);if(a==1){a=2;}else{a=1;}"/>
</body></html>
- - - Updated - - -
خدمت شما
یکم به همریخته هست متن
ولی کار میکنه
مشکل شما این بوده که متغیر رو توی تابع تغییر میدید و هر بار خودتون از اول توش تعریف میکنید
متغیر باید خارج تابع باشه و بعد از اجرای تابع تغییر کنه
