ساخت button های ساده کلیک شدنی با تغییر حالت [بایگانی]

leaping

جمعه 26 اردیبهشت 1393, 12:57 عصر

سلام
اگر بخوام یه لیست button مثلا ده تا داشته باشم و هر وقت رو هر کدوم کلیک میکنم کلاسش عوض بشه چیکار باید بکنم.
با این وصف که با کلیک شدن روی هر button حالت و یا کلاس button های دیگه به حالت اول برگرده و تنها button کلیک شده تغییرات اعمال شده رو داشته باشه

Mori Bone

جمعه 26 اردیبهشت 1393, 13:13 عصر

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="jquary.js"></script>
<script type="text/javascript">
function removeclass() {
var spancount = $('#test > span').length;
for(var i=1;i<=spancount;i++)
$('#test > span:nth-child(' + i + ')').removeClass('red');
}
$(function() {
$('#test > span').click(function() {

removeclass();
$(this).addClass('red');
});
});
</script>
<style>
span
{
padding: 10px;
background-color: #000;
}
span.red
{
padding: 10px;
background-color: red;
}
</style>
</head>

<body>
<div id="test">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>

</body>
</html>

روی مکان مشکی کلیک کن ببین چی میشه!

leaping

جمعه 26 اردیبهشت 1393, 18:50 عصر

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="jquary.js"></script>
<script type="text/javascript">
function removeclass() {
var spancount = $('#test > span').length;
for(var i=1;i<=spancount;i++)
$('#test > span:nth-child(' + i + ')').removeClass('red');
}
$(function() {
$('#test > span').click(function() {

removeclass();
$(this).addClass('red');
});
});
</script>
<style>
span
{
padding: 10px;
background-color: #000;
}
span.red
{
padding: 10px;
background-color: red;
}
</style>
</head>

<body>
<div id="test">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>

</body>
</html>

روی مکان مشکی کلیک کن ببین چی میشه!
این الان چیه قراره چه اتفاقی بیفته ؟ :لبخند:

Mori Bone

جمعه 26 اردیبهشت 1393, 19:49 عصر

رو هر کدوم که کلیک کنی قرمز میشه
در هر لحظه فقط یه دکمه قرمزه

leaping

دوشنبه 29 اردیبهشت 1393, 19:13 عصر

نظر دادم منصرف شدم حالا چطور این نظرو پاک کنم نمیدونم ...خخخ
باز ممنون

Mori Bone

دوشنبه 29 اردیبهشت 1393, 19:22 عصر

این فایل رو دان کن بزار کنار فایل html در ضمن من خودم تستش کردم
119231

Mori Bone

دوشنبه 29 اردیبهشت 1393, 19:47 عصر

مشکل حل شد؟