[源码下载]
作者: webabcd
介绍
用Silverlight 1.0实现一个可以用鼠标或键盘弹奏,并且支持录音和回放的钢琴。(Silverlight+ASP.NET AJAX+DLINQ)
参考: http://silverlight.net/community/communitygallery.aspx
示例
Piano.xaml(用Expression Blend开发)
Piano.xaml.js
Default.aspx
Default.aspx.cs
Default.aspx.js
Piano.js
OK
[源码下载]
稳扎稳打Silverlight(2) - 1.0实例之支持录音和回放的钢琴(Silverlight+ASP.NET AJAX+DLINQ)
作者: webabcd
介绍
用Silverlight 1.0实现一个可以用鼠标或键盘弹奏,并且支持录音和回放的钢琴。(Silverlight+ASP.NET AJAX+DLINQ)
参考: http://silverlight.net/community/communitygallery.aspx
示例
Piano.xaml(用Expression Blend开发)
<
Canvas
xmlns ="http://schemas.microsoft.com/client/2007"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
x:Name ="Piano"
Width ="1024" Height ="500" >
< Image Source ="Image/bg.jpg" Height ="500" Width ="1024" />
< Image x:Name ="imgC" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/C.jpg" Opacity ="0" />
< Image x:Name ="imgC2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/C2.jpg" Opacity ="0" />
< Image x:Name ="imgD" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/D.jpg" Opacity ="0" />
< Image x:Name ="imgD2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/D2.jpg" Opacity ="0" />
< Image x:Name ="imgE" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/E.jpg" Opacity ="0" />
< Image x:Name ="imgF" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/F.jpg" Opacity ="0" />
< Image x:Name ="imgF2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/F2.jpg" Opacity ="0" />
< Image x:Name ="imgG" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/G.jpg" Opacity ="0" />
< Image x:Name ="imgG2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/G2.jpg" Opacity ="0" />
< Image x:Name ="imgA" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/A.jpg" Opacity ="0" />
< Image x:Name ="imgA2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/A2.jpg" Opacity ="0" />
< Image x:Name ="imgB" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/B.jpg" Opacity ="0" />
< MediaElement x:Name ="C" AutoPlay ="false" Source ="Media/C.wma" />
< MediaElement x:Name ="C2" AutoPlay ="false" Source ="Media/C2.wma" />
< MediaElement x:Name ="D" AutoPlay ="false" Source ="Media/D.wma" />
< MediaElement x:Name ="D2" AutoPlay ="false" Source ="Media/D2.wma" />
< MediaElement x:Name ="E" AutoPlay ="false" Source ="Media/E.wma" />
< MediaElement x:Name ="F" AutoPlay ="false" Source ="Media/F.wma" />
< MediaElement x:Name ="F2" AutoPlay ="false" Source ="Media/F2.wma" />
< MediaElement x:Name ="G" AutoPlay ="false" Source ="Media/G.wma" />
< MediaElement x:Name ="G2" AutoPlay ="false" Source ="Media/G2.wma" />
< MediaElement x:Name ="A" AutoPlay ="false" Source ="Media/A.wma" />
< MediaElement x:Name ="A2" AutoPlay ="false" Source ="Media/A2.wma" />
< MediaElement x:Name ="B" AutoPlay ="false" Source ="Media/B.wma" />
< Canvas x:Name ="pathCanvas" >
< Path x:Name ="CPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="161.666656494141" Height ="272.333312988281" Canvas.Left ="135.5" Canvas.Top ="138.83332824707" Data ="M272.66667,140 L136,330 147.33333,336 162.66667,410.66667 247.33333,410 234.66667,330.66667 278,248 254,242.66667 258.66667,200.66667 296.66667,139.33333 272.66667,140" />
< Path x:Name ="C2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="91" Height ="136.333319306374" Canvas.Left ="263.5" Canvas.Top ="105.500005066396" Data ="M325.33333,106.66667 L264,202.66667 266,241.33333 307.33333,238.66667 354,138 351.33333,106.66666 326.66667,106" />
< Path x:Name ="DPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="131" Height ="274.333297729492" Canvas.Left ="247.499999999999" Canvas.Top ="137.499984741212" Data ="M358,142.66667 L311.33333,243.33333 288.66667,246 248,330.66667 258,338 266.66667,411.33333 354,410.66665 347.33333,330.66668 374,246.66668 350,243.33336 352.66667,202.66669 378,138.00005 360.66667,140.00005" />
< Path x:Name ="D2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="70.3333129882813" Height ="134.333319425583" Canvas.Left ="356.83334350586" Canvas.Top ="107.500003457069" Data ="M394.66667,108.66667 L357.33333,204 359.33333,241.33333 398,240.66667 426.66667,134.66667 425.33333,108" />
< Path x:Name ="EPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="117.666656494141" Height ="274.333343505859" Canvas.Left ="358.833343505859" Canvas.Top ="137.5" Data ="M431.33333,140 L403.33333,245.33333 381.33333,248 359.33333,330 368.66667,339.33333 372,411.33333 458,411.33333 455.33333,331.33333 476,138 433.33333,138.66667" />
< Path x:Name ="FPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="99.6666564941406" Height ="273.666680037975" Canvas.Left ="470.83334350586" Canvas.Top ="138.833345949649" Data ="M486.66667,140.66667 L471.33333,332 477.33333,334 476.66667,412 563.33333,411.33335 564,339.33334 570,328 560,246.66665 535.33333,243.33331 530,139.3333 486.66667,139.33329" />
< Path x:Name ="F2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="51" Height ="133.666656494141" Canvas.Left ="534.166687011719" Canvas.Top ="108.16665649414" Data ="M538.66667,109.33333 L534.66667,137.33333 542,241.33333 584,240.66666 584.66667,205.33334 568,108.66667 540.66667,108.66668" />
< Path x:Name ="GPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="111" Height ="274.333343505859" Canvas.Left ="570.166687011719" Canvas.Top ="137.5" Data ="M570.66667,248 L582.66667,336 582,411.33333 669.33333,410.66667 672.66667,332.66667 680.66667,330 655.33333,245.33333 631.33333,244 601.33333,138 578.66667,138 594.66667,244.66667 571.33333,248" />
< Path x:Name ="G2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="76.3333129882813" Height ="131.666656494141" Canvas.Left ="603.5" Canvas.Top ="110.166664123534" Data ="M612,111.33333 L604,136.66667 636,238.66667 636.66667,241.33333 679.33333,206.66667 641.33333,111.33334 612.66667,110.66668" />
< Path x:Name ="APath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="138.333312988281" Height ="274.333343505859" Canvas.Left ="655.5" Canvas.Top ="137.5" Data ="M665.33333,246 L694.66667,336.66667 686,411.33333 774.66667,410 785.33333,335.33333 793.33333,328.66667 750.66667,246.66667 722,243.33333 673.33333,138 656,138.66667 688.66667,216.66667 685.33333,245.33333 666,246" />
< Path x:Name ="A2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="95" Height ="131" Canvas.Left ="676.166687011719" Canvas.Top ="110.833320617675" Data ="M682,111.33333 L676.66667,138.66667 730.66667,240.66667 768.66667,241.33333 770.66667,204.00001 713.33333,111.33334 683.33333,111.33335" />
< Path x:Name ="BPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="172.333312988281" Height ="275.666687011719" Canvas.Left ="733.5" Canvas.Top ="136.833320051431" Data ="M758,247.33333 L806,333.33333 790,412 878,412 894.66667,334 905.33333,327.33333 764.66667,138.66667 734,137.33333 776.66667,207.33334 778.66667,246.66668 758.66667,248" />
</ Canvas >
< Ellipse x:Name ="stopRecord" Height ="30" Width ="30" Canvas.Left ="40" Canvas.Top ="430"
Stroke ="Black" StrokeThickness ="3" Fill ="Red" />
< Ellipse x:Name ="startRecord" Height ="30" Width ="30" Canvas.Left ="80" Canvas.Top ="430"
Stroke ="Black" StrokeThickness ="3" Fill ="Green" />
< Canvas Width ="60" Height ="30" Canvas.Left ="760" Canvas.Top ="422" Cursor ="Hand" >
< TextBlock x:Name ="play" TextWrapping ="Wrap" FontSize ="28" Foreground ="#FF4C7185" Text ="Play" >
</ TextBlock >
</ Canvas >
< TextBlock x:Name ="lblMussicBook" TextWrapping ="Wrap" Canvas.Left ="120" Canvas.Top ="434" FontSize ="14" Foreground ="#FFFFFFFF" Text ="MusicBook:" >
</ TextBlock >
< TextBlock x:Name ="lblName" TextWrapping ="Wrap" Canvas.Left ="520" Canvas.Top ="434" FontSize ="14" Foreground ="#FFFFFFFF" Text ="Name:" >
</ TextBlock >
</ Canvas >
xmlns ="http://schemas.microsoft.com/client/2007"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
x:Name ="Piano"
Width ="1024" Height ="500" >
< Image Source ="Image/bg.jpg" Height ="500" Width ="1024" />
< Image x:Name ="imgC" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/C.jpg" Opacity ="0" />
< Image x:Name ="imgC2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/C2.jpg" Opacity ="0" />
< Image x:Name ="imgD" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/D.jpg" Opacity ="0" />
< Image x:Name ="imgD2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/D2.jpg" Opacity ="0" />
< Image x:Name ="imgE" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/E.jpg" Opacity ="0" />
< Image x:Name ="imgF" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/F.jpg" Opacity ="0" />
< Image x:Name ="imgF2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/F2.jpg" Opacity ="0" />
< Image x:Name ="imgG" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/G.jpg" Opacity ="0" />
< Image x:Name ="imgG2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/G2.jpg" Opacity ="0" />
< Image x:Name ="imgA" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/A.jpg" Opacity ="0" />
< Image x:Name ="imgA2" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/A2.jpg" Opacity ="0" />
< Image x:Name ="imgB" Height ="500" Width ="1024" Canvas.Top ="0" Source ="Image/B.jpg" Opacity ="0" />
< MediaElement x:Name ="C" AutoPlay ="false" Source ="Media/C.wma" />
< MediaElement x:Name ="C2" AutoPlay ="false" Source ="Media/C2.wma" />
< MediaElement x:Name ="D" AutoPlay ="false" Source ="Media/D.wma" />
< MediaElement x:Name ="D2" AutoPlay ="false" Source ="Media/D2.wma" />
< MediaElement x:Name ="E" AutoPlay ="false" Source ="Media/E.wma" />
< MediaElement x:Name ="F" AutoPlay ="false" Source ="Media/F.wma" />
< MediaElement x:Name ="F2" AutoPlay ="false" Source ="Media/F2.wma" />
< MediaElement x:Name ="G" AutoPlay ="false" Source ="Media/G.wma" />
< MediaElement x:Name ="G2" AutoPlay ="false" Source ="Media/G2.wma" />
< MediaElement x:Name ="A" AutoPlay ="false" Source ="Media/A.wma" />
< MediaElement x:Name ="A2" AutoPlay ="false" Source ="Media/A2.wma" />
< MediaElement x:Name ="B" AutoPlay ="false" Source ="Media/B.wma" />
< Canvas x:Name ="pathCanvas" >
< Path x:Name ="CPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="161.666656494141" Height ="272.333312988281" Canvas.Left ="135.5" Canvas.Top ="138.83332824707" Data ="M272.66667,140 L136,330 147.33333,336 162.66667,410.66667 247.33333,410 234.66667,330.66667 278,248 254,242.66667 258.66667,200.66667 296.66667,139.33333 272.66667,140" />
< Path x:Name ="C2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="91" Height ="136.333319306374" Canvas.Left ="263.5" Canvas.Top ="105.500005066396" Data ="M325.33333,106.66667 L264,202.66667 266,241.33333 307.33333,238.66667 354,138 351.33333,106.66666 326.66667,106" />
< Path x:Name ="DPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="131" Height ="274.333297729492" Canvas.Left ="247.499999999999" Canvas.Top ="137.499984741212" Data ="M358,142.66667 L311.33333,243.33333 288.66667,246 248,330.66667 258,338 266.66667,411.33333 354,410.66665 347.33333,330.66668 374,246.66668 350,243.33336 352.66667,202.66669 378,138.00005 360.66667,140.00005" />
< Path x:Name ="D2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="70.3333129882813" Height ="134.333319425583" Canvas.Left ="356.83334350586" Canvas.Top ="107.500003457069" Data ="M394.66667,108.66667 L357.33333,204 359.33333,241.33333 398,240.66667 426.66667,134.66667 425.33333,108" />
< Path x:Name ="EPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="117.666656494141" Height ="274.333343505859" Canvas.Left ="358.833343505859" Canvas.Top ="137.5" Data ="M431.33333,140 L403.33333,245.33333 381.33333,248 359.33333,330 368.66667,339.33333 372,411.33333 458,411.33333 455.33333,331.33333 476,138 433.33333,138.66667" />
< Path x:Name ="FPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="99.6666564941406" Height ="273.666680037975" Canvas.Left ="470.83334350586" Canvas.Top ="138.833345949649" Data ="M486.66667,140.66667 L471.33333,332 477.33333,334 476.66667,412 563.33333,411.33335 564,339.33334 570,328 560,246.66665 535.33333,243.33331 530,139.3333 486.66667,139.33329" />
< Path x:Name ="F2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="51" Height ="133.666656494141" Canvas.Left ="534.166687011719" Canvas.Top ="108.16665649414" Data ="M538.66667,109.33333 L534.66667,137.33333 542,241.33333 584,240.66666 584.66667,205.33334 568,108.66667 540.66667,108.66668" />
< Path x:Name ="GPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="111" Height ="274.333343505859" Canvas.Left ="570.166687011719" Canvas.Top ="137.5" Data ="M570.66667,248 L582.66667,336 582,411.33333 669.33333,410.66667 672.66667,332.66667 680.66667,330 655.33333,245.33333 631.33333,244 601.33333,138 578.66667,138 594.66667,244.66667 571.33333,248" />
< Path x:Name ="G2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="76.3333129882813" Height ="131.666656494141" Canvas.Left ="603.5" Canvas.Top ="110.166664123534" Data ="M612,111.33333 L604,136.66667 636,238.66667 636.66667,241.33333 679.33333,206.66667 641.33333,111.33334 612.66667,110.66668" />
< Path x:Name ="APath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="138.333312988281" Height ="274.333343505859" Canvas.Left ="655.5" Canvas.Top ="137.5" Data ="M665.33333,246 L694.66667,336.66667 686,411.33333 774.66667,410 785.33333,335.33333 793.33333,328.66667 750.66667,246.66667 722,243.33333 673.33333,138 656,138.66667 688.66667,216.66667 685.33333,245.33333 666,246" />
< Path x:Name ="A2Path" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="95" Height ="131" Canvas.Left ="676.166687011719" Canvas.Top ="110.833320617675" Data ="M682,111.33333 L676.66667,138.66667 730.66667,240.66667 768.66667,241.33333 770.66667,204.00001 713.33333,111.33334 683.33333,111.33335" />
< Path x:Name ="BPath" Opacity ="0.01" Fill ="#FFFFFFFF" Stretch ="Fill" Stroke ="#FF000000" Width ="172.333312988281" Height ="275.666687011719" Canvas.Left ="733.5" Canvas.Top ="136.833320051431" Data ="M758,247.33333 L806,333.33333 790,412 878,412 894.66667,334 905.33333,327.33333 764.66667,138.66667 734,137.33333 776.66667,207.33334 778.66667,246.66668 758.66667,248" />
</ Canvas >
< Ellipse x:Name ="stopRecord" Height ="30" Width ="30" Canvas.Left ="40" Canvas.Top ="430"
Stroke ="Black" StrokeThickness ="3" Fill ="Red" />
< Ellipse x:Name ="startRecord" Height ="30" Width ="30" Canvas.Left ="80" Canvas.Top ="430"
Stroke ="Black" StrokeThickness ="3" Fill ="Green" />
< Canvas Width ="60" Height ="30" Canvas.Left ="760" Canvas.Top ="422" Cursor ="Hand" >
< TextBlock x:Name ="play" TextWrapping ="Wrap" FontSize ="28" Foreground ="#FF4C7185" Text ="Play" >
</ TextBlock >
</ Canvas >
< TextBlock x:Name ="lblMussicBook" TextWrapping ="Wrap" Canvas.Left ="120" Canvas.Top ="434" FontSize ="14" Foreground ="#FFFFFFFF" Text ="MusicBook:" >
</ TextBlock >
< TextBlock x:Name ="lblName" TextWrapping ="Wrap" Canvas.Left ="520" Canvas.Top ="434" FontSize ="14" Foreground ="#FFFFFFFF" Text ="Name:" >
</ TextBlock >
</ Canvas >
Piano.xaml.js
if
(
!
window.Piano)
window.Piano = {} ;
Piano.Page = function ()
{
}
Piano.Page.prototype =
{
handleLoad: function(control, userContext, rootElement)
{
this.control = control;
// Sample event hookup:
rootElement.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleMouseDown));
},
// Sample event handler
handleMouseDown: function(sender, eventArgs)
{
// The following line of code shows how to find an element by name and call a method on it.
// this.control.content.findName("Timeline1").Begin();
}
}
window.Piano = {} ;
Piano.Page = function ()
{
}
Piano.Page.prototype =
{
handleLoad: function(control, userContext, rootElement)
{
this.control = control;
// Sample event hookup:
rootElement.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleMouseDown));
},
// Sample event handler
handleMouseDown: function(sender, eventArgs)
{
// The following line of code shows how to find an element by name and call a method on it.
// this.control.content.findName("Timeline1").Begin();
}
}
Default.aspx
<%
@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="_10_Piano_Default" Title="支持录音和回放的钢琴" %>
< asp:Content ID ="Content1" ContentPlaceHolderID ="head" runat ="Server" >
< script type ="text/javascript" src ="../Silverlight.js" ></ script >
< script type ="text/javascript" src ="Default.aspx.js" ></ script >
< script type ="text/javascript" src ="Piano.xaml.js" ></ script >
< script type ="text/javascript" src ="Piano.js" ></ script >
< style type ="text/css" >
.silverlightHost
{
height: 500px;
width: 1024px;
}
</ style >
</ asp:Content >
< asp:Content ID ="Content2" ContentPlaceHolderID ="ContentPlaceHolder1" runat ="Server" >
< asp:ScriptManager ID ="ScriptManager1" runat ="server" >
</ asp:ScriptManager >
< div id ="SilverlightControlHost" class ="silverlightHost" >
< script type ="text/javascript" >
var txtInput = '<%= txtInput.ClientID %>';
var txtName = '<%= txtName.ClientID %>';
createSilverlight();
</ script >
< asp:UpdateProgress ID ="UpdateProgress1" runat ="server" >
< ProgressTemplate >
< div style ="position: absolute; top: 0px; background-color: Red; color: White; z-index: 999" >
Loading </ div >
</ ProgressTemplate >
</ asp:UpdateProgress >
< asp:UpdatePanel ID ="UpdatePanel1" runat ="server" >
< ContentTemplate >
< asp:GridView ID ="GridView1" runat ="server" Style ="position: absolute; top: 0px;
width: 1024px" AllowPaging ="True" AllowSorting ="True" AutoGenerateColumns ="False"
DataKeyNames ="ID" DataSourceID ="LinqDataSource1" RowStyle-HorizontalAlign ="Center"
PageSize ="2" OnSelectedIndexChanged ="GridView1_SelectedIndexChanged" >
< Columns >
< asp:CommandField ShowSelectButton ="True" HeaderText ="选择" ItemStyle-Width ="40px" ></ asp:CommandField >
< asp:CommandField ShowDeleteButton ="True" HeaderText ="删除" ItemStyle-Width ="40px" ></ asp:CommandField >
< asp:BoundField DataField ="ID" HeaderText ="ID" InsertVisible ="False" ReadOnly ="True"
SortExpression ="ID" ItemStyle-Width ="40px" ></ asp:BoundField >
< asp:BoundField DataField ="Name" HeaderText ="名称" SortExpression ="Name" ></ asp:BoundField >
< asp:TemplateField HeaderText ="乐谱" SortExpression ="Details" ItemStyle-Width ="700px" >
< ItemTemplate >
< div style ="overflow: hidden; width: 666px" >
< asp:Label ID ="lblDetails" runat ="server" Text ='<%# Bind("Details") % > '> </ asp:Label >
</ div >
</ ItemTemplate >
</ asp:TemplateField >
</ Columns >
</ asp:GridView >
< asp:TextBox ID ="txtInput" runat ="server" Style ="position: absolute; left: 200px;
top: 434px; width: 300px" />
< asp:TextBox ID ="txtName" runat ="server" Style ="position: absolute; left: 566px;
top: 434px;" />
</ ContentTemplate >
< Triggers >
< asp:AsyncPostBackTrigger ControlID ="btnAdd" />
</ Triggers >
</ asp:UpdatePanel >
< asp:LinqDataSource ID ="LinqDataSource1" runat ="server" ContextTypeName ="Data.MusicBookDataContext"
EnableDelete ="True" TableName ="MusicBook" >
</ asp:LinqDataSource >
< asp:Button ID ="btnAdd" runat ="server" Text ="添加" Style ="position: absolute; left: 710px;
top: 434px;" OnClick ="btnAdd_Click" />
</ div >
</ asp:Content >
Inherits="_10_Piano_Default" Title="支持录音和回放的钢琴" %>
< asp:Content ID ="Content1" ContentPlaceHolderID ="head" runat ="Server" >
< script type ="text/javascript" src ="../Silverlight.js" ></ script >
< script type ="text/javascript" src ="Default.aspx.js" ></ script >
< script type ="text/javascript" src ="Piano.xaml.js" ></ script >
< script type ="text/javascript" src ="Piano.js" ></ script >
< style type ="text/css" >
.silverlightHost
{
height: 500px;
width: 1024px;
}
</ style >
</ asp:Content >
< asp:Content ID ="Content2" ContentPlaceHolderID ="ContentPlaceHolder1" runat ="Server" >
< asp:ScriptManager ID ="ScriptManager1" runat ="server" >
</ asp:ScriptManager >
< div id ="SilverlightControlHost" class ="silverlightHost" >
< script type ="text/javascript" >
var txtInput = '<%= txtInput.ClientID %>';
var txtName = '<%= txtName.ClientID %>';
createSilverlight();
</ script >
< asp:UpdateProgress ID ="UpdateProgress1" runat ="server" >
< ProgressTemplate >
< div style ="position: absolute; top: 0px; background-color: Red; color: White; z-index: 999" >
Loading </ div >
</ ProgressTemplate >
</ asp:UpdateProgress >
< asp:UpdatePanel ID ="UpdatePanel1" runat ="server" >
< ContentTemplate >
< asp:GridView ID ="GridView1" runat ="server" Style ="position: absolute; top: 0px;
width: 1024px" AllowPaging ="True" AllowSorting ="True" AutoGenerateColumns ="False"
DataKeyNames ="ID" DataSourceID ="LinqDataSource1" RowStyle-HorizontalAlign ="Center"
PageSize ="2" OnSelectedIndexChanged ="GridView1_SelectedIndexChanged" >
< Columns >
< asp:CommandField ShowSelectButton ="True" HeaderText ="选择" ItemStyle-Width ="40px" ></ asp:CommandField >
< asp:CommandField ShowDeleteButton ="True" HeaderText ="删除" ItemStyle-Width ="40px" ></ asp:CommandField >
< asp:BoundField DataField ="ID" HeaderText ="ID" InsertVisible ="False" ReadOnly ="True"
SortExpression ="ID" ItemStyle-Width ="40px" ></ asp:BoundField >
< asp:BoundField DataField ="Name" HeaderText ="名称" SortExpression ="Name" ></ asp:BoundField >
< asp:TemplateField HeaderText ="乐谱" SortExpression ="Details" ItemStyle-Width ="700px" >
< ItemTemplate >
< div style ="overflow: hidden; width: 666px" >
< asp:Label ID ="lblDetails" runat ="server" Text ='<%# Bind("Details") % > '> </ asp:Label >
</ div >
</ ItemTemplate >
</ asp:TemplateField >
</ Columns >
</ asp:GridView >
< asp:TextBox ID ="txtInput" runat ="server" Style ="position: absolute; left: 200px;
top: 434px; width: 300px" />
< asp:TextBox ID ="txtName" runat ="server" Style ="position: absolute; left: 566px;
top: 434px;" />
</ ContentTemplate >
< Triggers >
< asp:AsyncPostBackTrigger ControlID ="btnAdd" />
</ Triggers >
</ asp:UpdatePanel >
< asp:LinqDataSource ID ="LinqDataSource1" runat ="server" ContextTypeName ="Data.MusicBookDataContext"
EnableDelete ="True" TableName ="MusicBook" >
</ asp:LinqDataSource >
< asp:Button ID ="btnAdd" runat ="server" Text ="添加" Style ="position: absolute; left: 710px;
top: 434px;" OnClick ="btnAdd_Click" />
</ div >
</ asp:Content >
Default.aspx.cs
using
System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Xml.Linq;
public partial class _10_Piano_Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnAdd_Click(object sender, EventArgs e)
{
Data.MusicBookDataContext mbdc = new Data.MusicBookDataContext();
Data.MusicBook mb = new Data.MusicBook();
mb.Name = txtName.Text;
mb.Details = txtInput.Text;
mbdc.MusicBook.Add(mb);
mbdc.SubmitChanges();
txtName.Text = "";
txtInput.Text = "";
GridView1.DataBind();
}
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
txtName.Text = GridView1.Rows[GridView1.SelectedIndex].Cells[3].Text;
txtInput.Text = ((Label)GridView1.Rows[GridView1.SelectedIndex].Cells[4].FindControl("lblDetails")).Text;
}
}
using System.Data;
using System.Configuration;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Xml.Linq;
public partial class _10_Piano_Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnAdd_Click(object sender, EventArgs e)
{
Data.MusicBookDataContext mbdc = new Data.MusicBookDataContext();
Data.MusicBook mb = new Data.MusicBook();
mb.Name = txtName.Text;
mb.Details = txtInput.Text;
mbdc.MusicBook.Add(mb);
mbdc.SubmitChanges();
txtName.Text = "";
txtInput.Text = "";
GridView1.DataBind();
}
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
txtName.Text = GridView1.Rows[GridView1.SelectedIndex].Cells[3].Text;
txtInput.Text = ((Label)GridView1.Rows[GridView1.SelectedIndex].Cells[4].FindControl("lblDetails")).Text;
}
}
Default.aspx.js
function
createSilverlight()
{
var scene = new Webabcd.Piano();
Silverlight.createObjectEx({
source: "Piano.xaml",
parentElement: document.getElementById("SilverlightControlHost"),
id: "SilverlightControl",
properties: {
width: "100%",
height: "100%",
version: "1.0",
isWindowless: "true"
},
events: {
onLoad: Silverlight.createDelegate(scene, scene.handleLoad)
}
});
}
if ( ! window.Silverlight)
window.Silverlight = {} ;
Silverlight.createDelegate = function (instance, method) {
return function() {
return method.apply(instance, arguments);
}
}
{
var scene = new Webabcd.Piano();
Silverlight.createObjectEx({
source: "Piano.xaml",
parentElement: document.getElementById("SilverlightControlHost"),
id: "SilverlightControl",
properties: {
width: "100%",
height: "100%",
version: "1.0",
isWindowless: "true"
},
events: {
onLoad: Silverlight.createDelegate(scene, scene.handleLoad)
}
});
}
if ( ! window.Silverlight)
window.Silverlight = {} ;
Silverlight.createDelegate = function (instance, method) {
return function() {
return method.apply(instance, arguments);
}
}
Piano.js
if
(
!
window.Webabcd)
window.Webabcd = {} ;
Webabcd.Piano = function()
{
}
Webabcd.Piano.prototype =
{
handleLoad: function(control, rootElement)
{
// plugin(插件)
this.control = control;
// 根Canvas元素
this.rootElement = rootElement;
// object.addEventListener(eventName, functionReference)为对象添加一个事件监听器(事件名称,函数名称)
// Silverlight.createDelegate用来创建一个调用“this”上下文下的特定函数的委托,其被定义在runtime
// Silverlight.createDelegate = function(instance, method)
// {
// return function()
// {
// return method.apply(instance, arguments);
// }
// }
this.rootElement.addEventListener("GotFocus", this.resetPiano));
this.rootElement.addEventListener("KeyDown", this.handleKeyDown));
this.rootElement.addEventListener("KeyUp", this.handleKeyUp));
// 鼠标热区的Canvas
// object.findName(name)
this.pathCanvas = rootElement.findName("pathCanvas");
// 开始录制按钮
this.startRecord = rootElement.findName("startRecord");
this.startRecord.addEventListener("MouseLeftButtonDown", this.handleStartRecord));
// 停止录制按钮
this.stopRecord = rootElement.findName("stopRecord");
this.stopRecord.addEventListener("MouseLeftButtonDown", this.handleStopRecord));
// 默认为选中停止录制按钮
// plugin.content.findName(objectName)
document.getElementById('SilverlightControl').content.findName("stopRecord").Stroke = "LightBlue";
document.getElementById('SilverlightControl').content.findName("stopRecord").StrokeThickness = 6;
// 播放按钮
this.play = rootElement.findName("play");
this.play.addEventListener("MouseLeftButtonDown", this.handlePlay));
// object.children对应<Canvas>一个或多个子元素</Canvas>
// object.getItem(index)获取集合内指定的对象
// object.count集合内的成员数量
for(var i = 0; i<this.pathCanvas.children.count; ++i)
{
// 为所有鼠标热区添加相关的事件监听器
this.pathCanvas.children.getItem(i).addEventListener("MouseLeftButtonDown", this.handleMouseDown));
this.pathCanvas.children.getItem(i).addEventListener("MouseLeftButtonUp", this.handleMouseUp));
}
// 是否启用录制
this._enableRecord = false;
// 上一次按键的时间
this._prevTime = new Date().getTime();
},
// 单击开始录制按钮
handleStartRecord: function(sender, eventArgs)
{
// 设置开始录制按钮样式
sender.Stroke = 'LightBlue';
sender.StrokeThickness = 6;
// 设置停止录制按钮样式
document.getElementById('SilverlightControl').content.findName("stopRecord").Stroke = "Black";
document.getElementById('SilverlightControl').content.findName("stopRecord").StrokeThickness = 3;
// 启用录音
this._enableRecord = true;
// 记录时间
this._prevTime = new Date().getTime();
},
// 单击停止录制按钮
handleStopRecord: function(sender, eventArgs)
{
// 设置停止录制按钮样式
sender.Stroke = 'LightBlue';
sender.StrokeThickness = 6;
// 设置开始录制按钮样式
document.getElementById('SilverlightControl').content.findName("startRecord").Stroke = "Black";
document.getElementById('SilverlightControl').content.findName("startRecord").StrokeThickness = 3;
// 清空乐谱名称和乐谱内容
document.getElementById(txtInput).value = '';
document.getElementById(txtName).value = '';
// 停止录音
this._enableRecord = false;
},
// 单击播放按钮
handlePlay: function(sender, eventArgs)
{
// 根据乐谱自动播放
autoPlay(this, 0);
},
// 记录乐谱
handleRecord: function(currentPianoKeyID)
{
if (this._enableRecord)
{
// 插入乐谱
document.getElementById(txtInput).value += new Date().getTime() - this._prevTime + ',';
document.getElementById(txtInput).value += currentPianoKeyID + ';';
// 更新时间
this._prevTime = new Date().getTime();
}
},
handleMouseDown: function(sender, eventArgs)
{
// object.captureMouse()为对象启用鼠标捕捉(鼠标离开热区也可触发相关事件,如MouseLeftButtonUp)
sender.captureMouse();
var currentPianoKeyID = sender.name.substr(0, sender.name.indexOf("Path"));
var currentImage = sender.findName("img" + currentPianoKeyID);
currentImage.opacity = 1;
var currentMediaElement = sender.findName(currentPianoKeyID);
currentMediaElement.stop();
currentMediaElement.play();
this.handleRecord(currentPianoKeyID);
},
handleMouseUp: function(sender, eventArgs)
{
// object.releaseMouseCapture()释放对象的鼠标捕捉
sender.releaseMouseCapture();
var currentPianoKeyID = sender.name.substr(0, sender.name.indexOf("Path"));
var currentImage = sender.findName("img" + currentPianoKeyID);
currentImage.opacity = 0;
},
pressKey: function (currentPianoKeyID)
{
var currentImage = this.control.content.findName("img" + currentPianoKeyID);
currentImage.opacity = 1;
var currentMediaElement = this.control.content.findName(currentPianoKeyID);
// object.play()播放,object.pause()暂停,object.stop()停止
currentMediaElement.stop();
currentMediaElement.play();
},
depressKey: function (currentPianoKeyID)
{
var currentImage = this.control.content.findName("img" + currentPianoKeyID);
currentImage.opacity = 0;
},
handleKeyDown: function (sender, eventArgs)
{
switch (eventArgs.Key)
{
// eventArgs.Key - 获取与该事件相关的键盘按键
case 55: this.pressKey("C"); this.handleRecord("C"); break;
case 48: this.pressKey("C2"); this.handleRecord("C2"); break;
case 53: this.pressKey("D"); this.handleRecord("D"); break;
case 33: this.pressKey("D2"); this.handleRecord("D2"); break;
case 32: this.pressKey("E"); this.handleRecord("E"); break;
case 51: this.pressKey("F"); this.handleRecord("F"); break;
case 36: this.pressKey("F2"); this.handleRecord("F2"); break;
case 31: this.pressKey("G"); this.handleRecord("G"); break;
case 37: this.pressKey("G2"); this.handleRecord("G2"); break;
case 43: this.pressKey("A"); this.handleRecord("A"); break;
case 39: this.pressKey("A2"); this.handleRecord("A2"); break;
case 42: this.pressKey("B"); this.handleRecord("B"); break;
}
},
handleKeyUp: function (sender, eventArgs)
{
switch (eventArgs.Key)
{
// eventArgs.Key - 获取与该事件相关的键盘按键
case 55: this.depressKey("C"); break;
case 48: this.depressKey("C2"); break;
case 53: this.depressKey("D"); break;
case 33: this.depressKey("D2"); break;
case 32: this.depressKey("E"); break;
case 51: this.depressKey("F"); break;
case 36: this.depressKey("F2"); break;
case 31: this.depressKey("G"); break;
case 37: this.depressKey("G2"); break;
case 43: this.depressKey("A"); break;
case 39: this.depressKey("A2"); break;
case 42: this.depressKey("B"); break;
}
},
resetPiano: function(sender, eventArgs)
{
this.depressKey("C");
this.depressKey("C2");
this.depressKey("D");
this.depressKey("D2");
this.depressKey("E");
this.depressKey("F");
this.depressKey("F2");
this.depressKey("G");
this.depressKey("G2");
this.depressKey("A");
this.depressKey("A2");
this.depressKey("B");
}
}
var _obj; // Webabcd.Piano对象
var _index; // 乐谱索引
function autoPlay(obj, index)
{
_obj = obj;
_index = index;
execAutoPlay();
}
function execAutoPlay()
{
_obj.resetPiano();
var str = document.getElementById(txtInput).value; // 乐谱
var ary = str.split(';'); // 间隔时间,按键名称
if (_index != 0 && typeof(ary[_index-1]) != 'undefined' && ary[_index-1] != '')
{
// 按下当前乐谱索引的上一个索引的按键
_obj.pressKey(ary[_index-1].split(',')[1]);
}
var currentIndex = _index;
_index++;
if (typeof(ary[currentIndex]) != 'undefined')
{
setTimeout("_obj.resetPiano();", 100)
// 经过当前乐谱索引的间隔时间则调用execAutoPlay()
setTimeout("execAutoPlay();", parseInt(ary[currentIndex].split(',')[0], 10));
}
}
window.Webabcd = {} ;
Webabcd.Piano = function()
{
}
Webabcd.Piano.prototype =
{
handleLoad: function(control, rootElement)
{
// plugin(插件)
this.control = control;
// 根Canvas元素
this.rootElement = rootElement;
// object.addEventListener(eventName, functionReference)为对象添加一个事件监听器(事件名称,函数名称)
// Silverlight.createDelegate用来创建一个调用“this”上下文下的特定函数的委托,其被定义在runtime
// Silverlight.createDelegate = function(instance, method)
// {
// return function()
// {
// return method.apply(instance, arguments);
// }
// }
this.rootElement.addEventListener("GotFocus", this.resetPiano));
this.rootElement.addEventListener("KeyDown", this.handleKeyDown));
this.rootElement.addEventListener("KeyUp", this.handleKeyUp));
// 鼠标热区的Canvas
// object.findName(name)
this.pathCanvas = rootElement.findName("pathCanvas");
// 开始录制按钮
this.startRecord = rootElement.findName("startRecord");
this.startRecord.addEventListener("MouseLeftButtonDown", this.handleStartRecord));
// 停止录制按钮
this.stopRecord = rootElement.findName("stopRecord");
this.stopRecord.addEventListener("MouseLeftButtonDown", this.handleStopRecord));
// 默认为选中停止录制按钮
// plugin.content.findName(objectName)
document.getElementById('SilverlightControl').content.findName("stopRecord").Stroke = "LightBlue";
document.getElementById('SilverlightControl').content.findName("stopRecord").StrokeThickness = 6;
// 播放按钮
this.play = rootElement.findName("play");
this.play.addEventListener("MouseLeftButtonDown", this.handlePlay));
// object.children对应<Canvas>一个或多个子元素</Canvas>
// object.getItem(index)获取集合内指定的对象
// object.count集合内的成员数量
for(var i = 0; i<this.pathCanvas.children.count; ++i)
{
// 为所有鼠标热区添加相关的事件监听器
this.pathCanvas.children.getItem(i).addEventListener("MouseLeftButtonDown", this.handleMouseDown));
this.pathCanvas.children.getItem(i).addEventListener("MouseLeftButtonUp", this.handleMouseUp));
}
// 是否启用录制
this._enableRecord = false;
// 上一次按键的时间
this._prevTime = new Date().getTime();
},
// 单击开始录制按钮
handleStartRecord: function(sender, eventArgs)
{
// 设置开始录制按钮样式
sender.Stroke = 'LightBlue';
sender.StrokeThickness = 6;
// 设置停止录制按钮样式
document.getElementById('SilverlightControl').content.findName("stopRecord").Stroke = "Black";
document.getElementById('SilverlightControl').content.findName("stopRecord").StrokeThickness = 3;
// 启用录音
this._enableRecord = true;
// 记录时间
this._prevTime = new Date().getTime();
},
// 单击停止录制按钮
handleStopRecord: function(sender, eventArgs)
{
// 设置停止录制按钮样式
sender.Stroke = 'LightBlue';
sender.StrokeThickness = 6;
// 设置开始录制按钮样式
document.getElementById('SilverlightControl').content.findName("startRecord").Stroke = "Black";
document.getElementById('SilverlightControl').content.findName("startRecord").StrokeThickness = 3;
// 清空乐谱名称和乐谱内容
document.getElementById(txtInput).value = '';
document.getElementById(txtName).value = '';
// 停止录音
this._enableRecord = false;
},
// 单击播放按钮
handlePlay: function(sender, eventArgs)
{
// 根据乐谱自动播放
autoPlay(this, 0);
},
// 记录乐谱
handleRecord: function(currentPianoKeyID)
{
if (this._enableRecord)
{
// 插入乐谱
document.getElementById(txtInput).value += new Date().getTime() - this._prevTime + ',';
document.getElementById(txtInput).value += currentPianoKeyID + ';';
// 更新时间
this._prevTime = new Date().getTime();
}
},
handleMouseDown: function(sender, eventArgs)
{
// object.captureMouse()为对象启用鼠标捕捉(鼠标离开热区也可触发相关事件,如MouseLeftButtonUp)
sender.captureMouse();
var currentPianoKeyID = sender.name.substr(0, sender.name.indexOf("Path"));
var currentImage = sender.findName("img" + currentPianoKeyID);
currentImage.opacity = 1;
var currentMediaElement = sender.findName(currentPianoKeyID);
currentMediaElement.stop();
currentMediaElement.play();
this.handleRecord(currentPianoKeyID);
},
handleMouseUp: function(sender, eventArgs)
{
// object.releaseMouseCapture()释放对象的鼠标捕捉
sender.releaseMouseCapture();
var currentPianoKeyID = sender.name.substr(0, sender.name.indexOf("Path"));
var currentImage = sender.findName("img" + currentPianoKeyID);
currentImage.opacity = 0;
},
pressKey: function (currentPianoKeyID)
{
var currentImage = this.control.content.findName("img" + currentPianoKeyID);
currentImage.opacity = 1;
var currentMediaElement = this.control.content.findName(currentPianoKeyID);
// object.play()播放,object.pause()暂停,object.stop()停止
currentMediaElement.stop();
currentMediaElement.play();
},
depressKey: function (currentPianoKeyID)
{
var currentImage = this.control.content.findName("img" + currentPianoKeyID);
currentImage.opacity = 0;
},
handleKeyDown: function (sender, eventArgs)
{
switch (eventArgs.Key)
{
// eventArgs.Key - 获取与该事件相关的键盘按键
case 55: this.pressKey("C"); this.handleRecord("C"); break;
case 48: this.pressKey("C2"); this.handleRecord("C2"); break;
case 53: this.pressKey("D"); this.handleRecord("D"); break;
case 33: this.pressKey("D2"); this.handleRecord("D2"); break;
case 32: this.pressKey("E"); this.handleRecord("E"); break;
case 51: this.pressKey("F"); this.handleRecord("F"); break;
case 36: this.pressKey("F2"); this.handleRecord("F2"); break;
case 31: this.pressKey("G"); this.handleRecord("G"); break;
case 37: this.pressKey("G2"); this.handleRecord("G2"); break;
case 43: this.pressKey("A"); this.handleRecord("A"); break;
case 39: this.pressKey("A2"); this.handleRecord("A2"); break;
case 42: this.pressKey("B"); this.handleRecord("B"); break;
}
},
handleKeyUp: function (sender, eventArgs)
{
switch (eventArgs.Key)
{
// eventArgs.Key - 获取与该事件相关的键盘按键
case 55: this.depressKey("C"); break;
case 48: this.depressKey("C2"); break;
case 53: this.depressKey("D"); break;
case 33: this.depressKey("D2"); break;
case 32: this.depressKey("E"); break;
case 51: this.depressKey("F"); break;
case 36: this.depressKey("F2"); break;
case 31: this.depressKey("G"); break;
case 37: this.depressKey("G2"); break;
case 43: this.depressKey("A"); break;
case 39: this.depressKey("A2"); break;
case 42: this.depressKey("B"); break;
}
},
resetPiano: function(sender, eventArgs)
{
this.depressKey("C");
this.depressKey("C2");
this.depressKey("D");
this.depressKey("D2");
this.depressKey("E");
this.depressKey("F");
this.depressKey("F2");
this.depressKey("G");
this.depressKey("G2");
this.depressKey("A");
this.depressKey("A2");
this.depressKey("B");
}
}
var _obj; // Webabcd.Piano对象
var _index; // 乐谱索引
function autoPlay(obj, index)
{
_obj = obj;
_index = index;
execAutoPlay();
}
function execAutoPlay()
{
_obj.resetPiano();
var str = document.getElementById(txtInput).value; // 乐谱
var ary = str.split(';'); // 间隔时间,按键名称
if (_index != 0 && typeof(ary[_index-1]) != 'undefined' && ary[_index-1] != '')
{
// 按下当前乐谱索引的上一个索引的按键
_obj.pressKey(ary[_index-1].split(',')[1]);
}
var currentIndex = _index;
_index++;
if (typeof(ary[currentIndex]) != 'undefined')
{
setTimeout("_obj.resetPiano();", 100)
// 经过当前乐谱索引的间隔时间则调用execAutoPlay()
setTimeout("execAutoPlay();", parseInt(ary[currentIndex].split(',')[0], 10));
}
}
OK
[源码下载]
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。