مشکل در اجرای کد جاوا اسکریپت [بایگانی]

Mr. Pink

یک شنبه 05 بهمن 1393, 21:54 عصر

سلام دوستان
میخواستم مشکل این کد چیه که اجرا نمیشه...دو تا سلول داریم یکی قرمز و دیگری آبی.کدی که نوشته با اجرای آن وقتی که هر بار روی دکمه کلیک میکنیم باید رنگ سلول ها عوض شه...اگه میشه بگید مشکل کد کجاست و چطوری میشه درستش کرد......در ضمن اگر نرم افزاری میشناسید که کد های جاوا اسکریپت رو مرحله به مرحله اجرا کنه و نشون بده تا بشه مشکل رو پیدا کرد اگه یه همچین برنامه ای میشناسین بگید دمتون گرم

<!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>

ali124

دوشنبه 06 بهمن 1393, 14:08 عصر

مشکلش شرط if تون که a مساوی 1 گذاشتین ولی هر دو شرط تون a مساوی 2 رو بررسی میکنه ، در ضمن وقتی شرط اول رو 1 قرار دادین چون آخر سر if دومتون اجرا میشه دوباره همون رنگ قرمز و ابی نشون میده و شما فک میکنید چیزی اجرا نشده که اگر رنگ های if دوم مثلا سبز و سیاه بدین مشکل حل میشه .
و اگرم بخواید با هر بار کلیک رنگش عوض شه که به نظرم از متد toggle استفاده کنید به نتیجه برسین.

javascriptgh

سه شنبه 07 بهمن 1393, 12:25 عصر

بیا داش :

<!DOCTYPE html>
<head>
<style>
table {
border-collapse:collapse;
}
td {
text-align:center;
height:20px;
width:40px;
border:1px solid black;
}
</style>
<script>
function show() {
var s = document.getElementById('td1').style.background;
var Arr = s.split('rgb');
if(Arr[1] == '(255, 0, 0)'){
document.getElementById('td1').style.background = 'rgb(0, 0, 256)';
document.getElementById('td2').style.background = 'rgb(256, 0, 0)';
}else{
document.getElementById('td2').style.background = 'rgb(0, 0, 256)';
document.getElementById('td1').style.background = 'rgb(256, 0, 0)';
}
}
</script>
<table id="tab">
<tr><td id="td1" style="background:rgb(256,0,0);"> 1 </td><td id="td2" style="background:rgb(0,0,256);"> 2 </td></tr>
</table>
<input type="button" value="Click" id="b1" onclick="show();" />