文章目錄 [隱藏]
本篇博客所用到的技術也是從別的博客學習到的，但目前找不到那篇博客的鏈接了。
var tabSize = tabSize || {}; tabSize.init = function (id) { //用來存儲當前更改寬度的Table Cell,避免快速移動鼠標的問題 var tTD; // 獲取需要修改列寬的表格 var table = document.getElementById(id); var headTh = table.rows[0]; for (j = 0; j < headTh.cells.length; j++) { headTh.cells[j].onmousedown = function () { //記錄單元格 tTD = this; if (event.offsetX > tTD.offsetWidth - 10) { tTD.mouseDown = true; tTD.oldX = event.x; tTD.oldWidth = tTD.offsetWidth; } }; headTh.cells[j].onmouseup = function () { //結束寬度調整 if (tTD == undefined) tTD = this; tTD.mouseDown = false; tTD.style.cursor = 'default'; }; headTh.cells[j].onmousemove = function () { //更改鼠標樣式 if (event.offsetX > this.offsetWidth - 10) this.style.cursor = 'col-resize'; else this.style.cursor = 'default'; //取出暫存的Table Cell if (tTD == undefined) tTD = this; //調整寬度 if (tTD.mouseDown != null && tTD.mouseDown == true) { tTD.style.cursor = 'default'; if (tTD.oldWidth + (event.x - tTD.oldX) > 0) tTD.width = tTD.oldWidth + (event.x - tTD.oldX); //調整列寬 tTD.style.width = tTD.width + 'px'; tTD.style.cursor = 'col-resize'; // 調整滾動表格的每個cell for (k = 0; k < table.rows.length; k++) { table.rows[k].cells[tTD.cellIndex].style.width = tTD.style.width; } } }; } }; // 調用 // 鼠標拖動列寬 setTimeout(function () { // 1.html代碼里就是一個普通的table元素 // 2.傳入table元素的id tabSize.init('documentList'); }, 600);
var tabSize = tabSize || {}; tabSize.init = function (id,headTableWrapperId) { //用來存儲當前更改寬度的Table Cell,避免快速移動鼠標的問題 var tTD; // 獲取需要修改列寬的表格 var table = document.getElementById(id); // 獲取固定頭部的表格 var tableHead = $('#'+ headTableWrapperId + ' .dataTables_scrollHeadInner table')[0]; // 獲取表格頭部th var headTh = tableHead.rows[0]; for (j = 0; j < headTh.cells.length; j++) { headTh.cells[j].onmousedown = function () { //記錄單元格 tTD = this; if (event.offsetX > tTD.offsetWidth - 10) { tTD.mouseDown = true; tTD.oldX = event.x; tTD.oldWidth = tTD.offsetWidth; } }; headTh.cells[j].onmouseup = function () { //結束寬度調整 if (tTD == undefined) tTD = this; tTD.mouseDown = false; tTD.style.cursor = 'default'; }; headTh.cells[j].onmousemove = function () { //更改鼠標樣式 if (event.offsetX > this.offsetWidth - 10) this.style.cursor = 'col-resize'; else this.style.cursor = 'default'; //取出暫存的Table Cell if (tTD == undefined) tTD = this; //調整寬度 if (tTD.mouseDown != null && tTD.mouseDown == true) { tTD.style.cursor = 'default'; if (tTD.oldWidth + (event.x - tTD.oldX) > 0) tTD.width = tTD.oldWidth + (event.x - tTD.oldX); //調整列寬 tTD.style.width = tTD.width + 'px'; tTD.style.cursor = 'col-resize'; // 調整滾動表格的每個cell for (k = 0; k < table.rows.length; k++) { table.rows[k].cells[tTD.cellIndex].style.width = tTD.style.width; } } }; } }; // 鼠標拖動列寬 setTimeout(function () { // 參數：1.table元素的id， // 2.datatable插件生成的最外層div的id，F12可查看到 tabSize.init('cfcPlanListIn','cfcPlanListIn_wrapper'); }, 2000);
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
query操作復選框(checkbox)的12個小技巧。
1、獲取單個checkbox選中項(三種寫法)
|
1
|
$( "input:checkbox:checked" ).val()
|
或者
|
1
|
$( "input:[type='checkbox']:checked" ).val();
|
或者
|
1
|
$( "input:[name='ck']:checked" ).val();
|
2、 獲取多個checkbox選中項
|
1
2
3
4
5
|
$( 'input:checkbox' ).each( function () {
if ($( this ).attr( 'checked' ) == true ) {
alert($( this ).val());
}
});
|
3、設置第一個checkbox 為選中值
|
1
|
$( 'input:checkbox:first' ).attr( "checked" , 'checked' );
|
或者
|
1
|
$( 'input:checkbox' ).eq(0).attr( "checked" , 'true' );
|
4、設置最后一個checkbox為選中值
|
1
|
$( 'input:radio:last' ).attr( 'checked' , 'checked' );
|
或者
|
1
|
$( 'input:radio:last' ).attr( 'checked' , 'true' );
|
5、根據索引值設置任意一個checkbox為選中值
|
1
|
$( 'input:checkbox).eq(索引值).attr(' checked ', ' true ');
|
索引值=0,1,2....
或者
|
1
|
$( 'input:radio' ).slice(1,2).attr( 'checked' , 'true' );
|
6、選中多個checkbox同時選中第1個和第2個的checkbox
|
1
|
$( 'input:radio' ).slice(0,2).attr( 'checked' , 'true' );
|
7、根據Value值設置checkbox為選中值
|
1
|
$( "input:checkbox[value='1']" ).attr( 'checked' , 'true' );
|
8、刪除Value=1的checkbox
|
1
|
$( "input:checkbox[value='1']" ).remove();
|
9、刪除第幾個checkbox
|
1
|
$( "input:checkbox" ).eq(索引值).remove();
|
索引值=0,1,2....
如刪除第3個checkbox:
|
1
|
$( "input:checkbox" ).eq(2).remove();
|
10、遍歷checkbox
|
1
2
3
|
$( 'input:checkbox' ).each( function (index, domEle) {
//寫入代碼
});
|
11、全部選中
|
1
2
3
|
$( 'input:checkbox' ).each( function () {
$( this ).attr( 'checked' , true );
});
|
12、全部取消選擇
|
1
2
3
|
$( 'input:checkbox' ).each( function () {
$( this ).attr( 'checked' , false );
});
|
JQuery對CheckBox的一些相關操作
一、通過選擇器選取CheckBox:
1.給CheckBox設置一個id屬性，通過id選擇器選?。?
|
1
|
< input type = "checkbox" name = "myBox" id = "chkOne" value = "1" checked = "checked" />
|
JQuery:
|
1
|
$( "#chkOne" ).click( function (){});
|
2.給CheckBox設置一個class屬性，通過類選擇器選?。?
|
1
|
< input type = "checkbox" name = "myBox" class = "chkTwo" value = "1" checked = "checked" />
|
JQuery:
|
1
2
|
$( ".chkTwo" ).click( function (){});
|
3.通過標簽選擇器和屬性選擇器來選?。?
|
1
2
|
< input type = "checkbox" name = "someBox" value = "1" checked = "checked" />
< input type = "checkbox" name = "someBox" value = "2" />
|
JQuery:
|
1
2
|
$( "input[name='someBox']" ).click( function (){});
|
二、對CheckBox的操作：
以這段checkBox代碼為例：
|
1
2
3
4
|
< input type = "checkbox" name = "box" value = "0" checked = "checked" />
< input type = "checkbox" name = "box" value = "1" />
< input type = "checkbox" name = "box" value = "2" />
< input type = "checkbox" name = "box" value = "3" />
|
1.遍歷checkbox用each()方法：
|
1
|
$( "input[name='box']" ).each( function (){});
|
2.設置checkbox被選中用attr();方法：
|
1
2
|
$( "input[name='box']" ).attr( "checked" , "checked" );
|
在HTML中，如果一個復選框被選中，對應的標記為 checked="checked"。 但如果用jquery alert($("#id").attr("checked")) 則會提示您是"true"而不是"checked"，所以判斷 if("checked"==$("#id").attr("checked")) 是錯誤的，應該是 if(true == $("#id").attr("checked"))
3.獲取被選中的checkbox的值：
|
1
2
3
4
|
$( "input[name='box'][checked]" ).each( function (){
if ( true == $( this ).attr( "checked" )) {
alert( $( this ).attr( 'value' ) );
}
|
或者：
|
1
2
3
4
|
$( "input[name='box']：checked" ).each( function (){
if ( true == $( this ).attr( "checked" )) {
alert( $( this ).attr( 'value' ) );
}
|
$("input[name='box']：checked")與 $("input[name='box']")有何區別沒試過，我試了用 $("input[name='box']")能成功。
4.獲取未選中的checkbox的值：
|
1
2
3
4
5
|
$( "input[name='box']" ).each( function (){
if ($( this ).attr( 'checked' ) == false ) {
alert($( this ).val());
}
});
|
5.設置checkbox的value屬性的值:
|
1
|
$( this ).attr( "value" ,值);
|
三、 一般都是創建一個js數組來存儲遍歷checkbox得到的值，創建js數組的方法：
1. var array= new Array();
2. 往數組添加數據：
array.push($(this).val());
3.數組以“,”分隔輸出：
alert(array.join(','));
文章來源：csdn
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
還是附上代碼吧。不多說，方便日后查看
父頁面代碼：
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<title>parents</title>
-
<meta charset="UTF-8">
-
</head>
-
<body>
-
<script language="javascript" type="text/javascript">
-
function sayhello() {
-
alert('Hello World!');
-
}
-
var value = 'value';
-
</script>
-
<div id="default">div內容</div>
-
<iframe src="child.html"></iframe>
-
</body>
-
</html>
子頁面
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<title>child</title>
-
<meta charset="UTF-8">
-
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
-
<script language="javascript" type="text/javascript">
-
$(function() {
-
//在iframe子頁面中查找父頁面元素
-
alert($('#default', window.parent.document).html());
-
//在iframe中調用父頁面中定義的變量
-
alert(parent.value);
-
//在iframe中調用父頁面中定義的方法
-
parent.sayhello();
-
});
-
</script>
-
</head>
-
<body>
-
<div>iframe子頁面內容</div>
-
</body>
-
</html>
注意：
父頁面的屬性和方法必須在iframe標簽之前
有時候我們的標簽都是從后臺獲取的數據，然后利用JS添加到頁面上，當我們寫生成的標簽的點擊事件（click）時沒有效果。
例如：
<section> 測試動態生成的DOM點擊事件 <br /> </section> <script src="jquery-1.11.2.min.js"></script> <script> $(function () { $.ajax({ type: "post", url: "Handler1.ashx", data: {}, success: function (data) { $("section").append(data); //把獲取的標簽動態添加到頁面中 } }) }); $("#test").click(function () { alert("Smile"); }) </script>
生成頁面，點擊A標簽無效果。
這里只介紹兩種解決方法。
①把事件寫在生成的字符串當中，感覺很low
里面什么方法名外面就聲明一個（需要帶參就傳參）。
②我一般喜歡在JS里面直接寫點擊事件，不喜歡在標簽里面寫事件
我們直接寫這個標簽的點擊事件是沒效果的，我們就換個寫法，利用On來完成。
這樣也可以完成點擊事件。
另附：a標簽的href也是可以執行腳本的，點擊事件也會執行腳本，點擊事件優先，然后在執行href鏈接。
下載一般都是把A標簽的Href給個一般處理程序的鏈接（參數就用？傳值）。但我這個下載的參數是動態生成的，在后臺生成字符串的時候沒有參數。需要在前臺根據用戶選擇的來進行傳遞參數。所以需要我們動態生成Href的鏈接
//下載 $("#uploadInfo").click(function () { var uids = ""; $(":checkbox[name='A']:checked").each(function (i, item) { uids += $(item).attr("data-id") + ","; }) if (uids === "") { NewAlertBox("warning","請最少選擇一項",2000); } else { var urls = "GroupTeamUserListDocUpload.ashx?CaseID=" + CaseID + "&UID=" + uids; $(this).attr("href", urls); //執行完了點擊事件，把Href賦值，然后自動跳轉href鏈接 } });
冒泡事件就是點擊子節點，會向上觸發父節點，祖先節點的點擊事件。
我們在平時的開發過程中，肯定會遇到在一個div（這個div可以是元素）包裹一個div的情況，但是呢，在這兩個div上都添加了事件，如果點擊里面的div我們希望處理這個div的事件，但是呢，我們不希望外層的div的事件也執行，這時候我們就要用到阻止冒泡。
通俗點來說吧，你在家里看電視，躲在自己的小房間，但是你不希望聲音傳到隔壁父母的耳朵里，這時候，你可能躲在被窩里，或者墻壁的隔音效果很好，阻隔聲音可以理解為阻止冒泡。
<style> #content{ width: 140px; border: 1px solid blue; } #msg{ width: 100px; height: 100px; margin: 20px; border: 1px solid red; } </style>
<body>
<div id="content">
外層div
<div id="msg">
內層div
</div>
</div>
</body>
顯示結果
對應的jQuery代碼如下：
<script type="text/javascript" src="js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ // 為內層div綁定click事件 $("#msg").click(function(){ alert("我是小div"); }); // 為外層div元素綁定click事件 $("#content").click(function(){ alert("我是大div"); }); // 為body元素綁定click事件 $("body").click(function(){ alert("我是body"); }); }); </script>
當點擊小div時，會觸發大div與body 的點擊事件。點擊大div時會觸發body的點擊事件。
如何防止這種冒泡事件發生呢？
修改如下：
<script type="text/javascript" src="js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ // 為內層div綁定click事件 $("#msg").click(function(event){ alert("我是小div"); event.stopPropagation(); // 阻止事件冒泡 }); // 為外層div元素綁定click事件 $("#content").click(function(event){ alert("我是大div"); event.stopPropagation(); // 阻止事件冒泡 }); // 為body元素綁定click事件 $("body").click(function(event){ alert("我是body"); event.stopPropagation(); // 阻止事件冒泡 }); });
event.stopPropagation(); // 阻止事件冒泡
有時候點擊提交按鈕會有一些默認事件。比如跳轉到別的界面。但是如果沒有通過驗證的話，就不應該跳轉。這時候可以通過設置event.preventDefault(); //阻止默認行為 ( 表單提交 )。
html部分
<body> <form action="test.html"> 用戶名：<input type="text" id="username" /> <br/> <input type="submit" value="提交" id="sub"/> </form> </body>
<script type="text/javascript" src="js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ $("#sub").click(function(event){ //獲取元素的值，val() 方法返回或設置被選元素的值。 var username = $("#username").val(); //判斷值是否為空 if(username==""){ //提示信息 //alert("文本框的值不能為空"); $("#msg").html("<p>文本框的值不能為空.</p>"); //阻止默認行為 ( 表單提交 ) event.preventDefault(); } }); }); </script>
//阻止默認行為 ( 表單提交 ) event.preventDefault();
還有一種防止默認行為的方法就是return false。效果一樣。
代碼如下：
<script type="text/javascript" src="js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ $("#sub").click(function(event){ //獲取元素的值，val() 方法返回或設置被選元素的值。 var username = $("#username").val(); //判斷值是否為空 if(username==""){ //提示信息 //alert("文本框的值不能為空"); $("#msg").html("<p>文本框的值不能為空.</p>"); //阻止默認行為 ( 表單提交 ) //event.preventDefault(); return false; } }); }); </script>
同理，上面的冒泡事件也可以通過return false來處理。
<script type="text/javascript" src="js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ // 為內層div綁定click事件 $("#msg").click(function(event){ alert("我是小div"); //event.stopPropagation(); // 阻止事件冒泡 return false; }); // 為外層div元素綁定click事件 $("#content").click(function(event){ alert("我是大div"); //event.stopPropagation(); // 阻止事件冒泡 return false; }); // 為body元素綁定click事件 $("body").click(function(event){ alert("我是body"); //event.stopPropagation(); // 阻止事件冒泡 return false; }); });
在開發中遇到這個問題，就是第一次加載的時候會錯位，出現窄很多的現象，在網上找了一番后，發現http://blog.csdn.net/bugscode/article/details/53432069這篇博客中給出的原因是清晰的，但是解決方法我沒怎么看明白，于是按照他所說的原因，即
這種情況是因為Datatables框架中使用到serverSide : true,// 服務器查詢數據屬性，它會使Table標簽中多一個style=”width: xx px;”屬性，這就導致了變化大小時標題對不齊現象。
然后在 datatable中加入了 serverSide 設置，
$('#charging_table').dataTable({
serverSide : false,
......})
既然是因為 serverSide 的原因，那我把它 設置為 false 結果問題還真解決了！
文章來源：csdn
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
var table = $.fn.dataTable.fnTables(true);
if ( table.length > 0 ) {
$(table).dataTable().fnAdjustColumnSizing();
}
-
$("#li_certificate").click(function () {
-
$(this).parent().addClass("selected").siblings().removeClass("selected");
-
$("#div_record").hide();
-
$("#div_certificate").show();
-
//這個位置寫那個重新適應寬度的代碼
-
});
input輸入框在獲得或失去焦點時隱藏或顯示文字，這樣的焦點效果想必很多朋友在填寫form表格的時候都曾見識過吧，本文使用jquery實現以下，感興趣的朋友可以參考下哈
大家可以看效果圖的搜索輸入框，默認顯示著“用戶名/Email”的提示，當這個 input 輸入框獲得焦點時，就自動清空等待用戶輸入，當用戶啥也沒輸入就離開這個 input 輸入框時，輸入框內又再次顯示“用戶名/Email”的提示。是不是很常見？很多搜索、登錄、表單都會用到這個效果，但是我看了N多個網站，有90%以上是這么實現的：
<input type="text" value="搜索關鍵字" onfocus="if(this.value == '搜索關鍵字') this.value = ''" onblur="if(this.value =='') this.value = '搜索關鍵字'" />
我是非常反對把 javascript 寫在 html 標簽里的，這和 style 寫在 html 標簽里一樣，雖然不違反 W3C 標準，但也不推薦這么寫。因為：
1.完全沒有復用性可言，如果是個表單，輸入框很多，每個都需要這樣的效果，那就每個都這么處理嗎？
2.如果要修改其中的提示文字，費時費力又不好維護。
3.我們倡導結構（html）、表現（css）、行為（javascript）三者分離，這才是一個好的頁面。
那要怎么寫才能實現這個效果，而且既有復用性，又好維護，又不需要把 js 寫進 html 里呢？
具體方法如下:
首先肯定是引入jQuery
Html代碼:
<div><input type="text" value="提示測試" class="input_test" /></div> <div><input type="text" value="請輸入搜索關鍵" class="input_test" /></div>
jQuery代碼:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $('.input_test').bind({ focus:function(){ if (this.value == this.defaultValue){ this.value=""; } }, blur:function(){ if (this.value == ""){ this.value = this.defaultValue; } } }); }) </script>
只要在實現的input輸入框加上”input_test”這個class就可以輕松實現了
文章來源：博客園
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
使用jquery控制div的顯示與隱藏，一句話就能搞定，例如：
顯示：
$("#id").show()表示為display：block，隱藏：
$("#id").hide()表示為display:none;
$("#id").toggle();切換元素的可見狀態。如果元素是可見的，切換為隱藏的；
如果元素是隱藏的，則切換為可見的。
顯示：
$("#id").css('display','block');//顯示隱藏：
$("#id").css('display','none');//隱藏或者
$("#id")[0].style.display='none';display = none 控制對象的隱藏
display = block控制對象的顯示
元素顯示：
$("#id").css('visibility','visible');//元素顯示元素隱藏：
$("#id").css('visibility','hidden');//元素隱藏CSS visibility 屬性規定元素是否可見。
visible 元素可見。
hidden 元素不可見。
collapse 在表格元素中使用時，此值可刪除一行或一列，但它不影響表格的布局。被行或列占據的空間會留給其他內容使用。如果此值被用在其他的元素上，會呈現為 "hidden"。
inherit 從父元素繼承 visibility 屬性的值。
注意：
display:none和visible:hidden都能把網頁上某個元素隱藏起來，在視覺效果上沒有區別，但是在一些DOM操作中兩者有區別:
display:none ---不為被隱藏的對象保留其物理空間，即該對象在頁面上徹底消失，通俗來說就是看不見也摸不到。
visible:hidden--- 使對象在網頁上不可見，但該對象在網頁上所占的空間沒有改變，即它仍然具有高度、寬度等屬性，通俗來說就是看不見但摸得到。
-
//第1種方法 ,給元素設置style屬性
-
$("#hidediv").css("display", "block");
-
//第2種方法 ,給元素換class，來實現隱藏div，前提是換的class樣式定義好了隱藏屬性
-
$("#hidediv").attr("class", "blockclass");
-
//第3種方法,通過jquery的css方法，設置div隱藏
-
$("#blockdiv").css("display", "none");
-
-
$("#hidediv").show();//顯示div
-
$("#blockdiv").hide();//隱藏div
文章來源：csdn
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
情景一：用onclick觸發的函數
-
html代碼：
-
<div id="0" style="border-bottom:1px solid #000;margin:0 auto;">
-
<div>1111</div>
-
<div class="original">
-
<div id="chartx1" class="chartstyle"></div>
-
<div id="charty1" class="chartstyle" ></div>
-
<button onclick="getDetail(this);" style="width:100%;height:30px;">查看信息</button>
-
</div>
-
</div>
-
<script>
-
function getDetail(obj){
-
alert(obj.parentNode.parentNode.id); //1
-
}
-
</script>
運行結果：
情景二:直接用click觸發的函數
-
html代碼：
-
<div id="0" style="border-bottom:1px solid #000;margin:0 auto;">
-
<div>1111</div>
-
<div class="original">
-
<div id="chartx1" class="chartstyle"></div>
-
<div id="charty1" class="chartstyle" ></div>
-
<button class="info_detail" style="width:100%;height:30px;">查看信息</button>
-
</div>
-
</div>
-
<script>
-
$(".info_detail").click(function(){
-
id=$(this).parent().parent().attr('id');
-
})
-
</script>
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
藍藍設計的小編 http://www.syprn.cn