MEMO
ナビゲーションに移動
検索に移動
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link href="../css/style.css" type="text/css" rel="stylesheet"> <style type="text/css"> </style> <script type="text/javascript" src="../js/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="../js/jquery.chromatable.js"></script> <script type="text/javascript" src="../js/jquery-ui-1.7.2.custom.min.js"></script> <script type="text/javascript"><!-- $(document).ready(function() { $("#tbl1").chromatable({ width: "300px", height: "100px", scrolling: "no" }); $("#addbtn").click(function() { var item = Object(); item.name = $("#item_name").val(); var row_id = "tr_" + item.name; $("#tbl1 tbody").append("<tr id='" + row_id + "'></tr>"); var tr = $("#" + row_id); var td_id = "td_" + item.name; tr.append("<td id='" + td_id + "'>" + item.name + "</td>"); var td_head = $("#" + td_id); td_head.click(function(){alert(row_id);}); tr.append("<td><input type='text' style='width:90px;'/></td>"); tr.append("<td><select></select></td>"); }); }); //--></script> <title></title> </head> <body> <div> name:<input type="text" id="item_name"/><br/> <input type="button" id="addbtn" value="add row"/> </div> <table id="tbl1" style="table-layout:fixed;width:300px;"> <col width="100px"> <col width="100px"> <col width="100px"> <thead> <th>f1</th> <th>f2</th> <th>f3</th> </thead> <tbody> </tbody> </table> </body> </html>
© 2006 矢木浩人