<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> </head> <script> var read = []; $(document).ready(function() { $('.myicon').click(function() { alert($(this).attr('x-data')); }); $('.hovers').click(function(){ read = [$(this).attr('id')]; alert('read'); updateRows(); }); }); function updateRows(){ for(var i in read) $('#'+read[i]).removeClass('unread').addClass('read'); } </script> <style> i.myicon{display: none;} .hovers td:first-child{ width: 300px; } .hovers:hover td{background-color: #CCC;} .hovers:hover td i.myicon{ float: right;margin: 2px;padding-left: 3px;padding-right: 3px;display: block;cursor: pointer;z-index: 1000; } .read {background-color: #EEE} .unread{background-color: #DDD} </style> <body> <table border="0" width="500"> <?php foreach (range(1, 5) as $value) { echo '<tr class="hovers unread" id="row'.$value.'"> <td>Name #' . $value . '<i class="myicon" x-data="x-' . $value . '">Xx</i><i class="myicon" x-data="o-' . $value . '">Oo</i></td> <td>Text #' . $value . '</td> </tr>'; } ?> </table> </body> </html>
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> </head> <script> var read = [['row2'],['row4']]; $(document).ready(function() { $('.myicon').click(function() { alert($(this).attr('x-data')); }); $('.hovers').click(function(){ read = [$(this).attr('id')]; alert('read'); updateRows(); }); updateRows(); }); function updateRows(){ for(var i in read) $('#'+read[i]).removeClass('unread').addClass('read'); } </script> <style> i.myicon{display: none;} .hovers td:first-child{ width: 300px; } .hovers:hover td{background-color: #CCC;} .hovers:hover td i.myicon{ float: right;margin: 2px;padding-left: 3px;padding-right: 3px;display: block;cursor: pointer;z-index: 1000; } .read {background-color: #EEE} .unread{background-color: #DDD} </style> <body> <table border="0" width="500"> <?php foreach (range(1, 5) as $value) { echo '<tr class="hovers unread" id="row'.$value.'"> <td>Name #' . $value . '<i class="myicon" x-data="x-' . $value . '">Xx</i><i class="myicon" x-data="o-' . $value . '">Oo</i></td> <td>Text #' . $value . '</td> </tr>'; } ?> </table> </body> </html>
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง