Copy codeThe Code is as follows:
<Html>
<Head>
<Title> ajax test </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Script type = "text/javascript" src = "jquery. js"> </script>
<Script type = "text/javascript">...
Function ajaxRequest ()...{
Var url = $ ("# stockurl"). val () + $ ("# stockinit"). val ();
$. Ajax (...{
Url: url,
Type: 'get ',
DataType: 'html ',
Timeout: 2000,
Success: function (response )...{
Var stocks = response. split (';');
For (var I = 0; I <stocks. length-1; I ++ )...{
Var content = stocks [I];
Var temp1 = content. split ('=') [0];
Var temp2 = content. split ('=') [1];
Var code = temp1.substr (temp1.length-6, 6 );
Var temp3 = temp2.replace ('"','');
Var name = temp3.split (',') [0];
Var tday_f = temp3.split (',') [1];
Var yest_f = temp3.split (',') [2];
Var curr_f = temp3.split (',') [3];
Var temp_f = curr_f-yest_f;
Certificate ('{a'{ I }.html (code );
Certificate ('{ B '{ I }.html (name );
If (curr_f> yest_f )...{
Certificate ('{c'{ I }.html ("<font color = 'red'>" + curr_f + "</font> ");
} Else if (curr_f <yest_f )...{
Certificate ('{c'{ I }.html ("<font color = 'green'>" + curr_f + "</font> ");
} Else ...{
Certificate ('{c'{ I }.html (curr_f );
}
Certificate ('mongod'{ I }.html (tday_f );
Certificate ('{e'{ I }.html (yest_f );
If (temp_f> 0 )...{
('{F'{ I }.html ("<font color = 'red'>" + temp_f.toFixed (2) + "</font> ");
Certificate ('{g'{ I }.html ("<font color = 'red'>" + (temp_f/yest_f) * 100). toFixed (2) + "</font> % ");
} Else if (temp_f <0 )...{
Certificate ('{f'{ I }.html ("<font color = 'green'>" + temp_f.toFixed (2) + "</font> ");
Certificate ('{g'{ I }.html ("<font color = 'green'>" + (temp_f/yest_f) * 100). toFixed (2) + "</font> % ");
} Else ...{
('{F'{ I }.html (temp_f.toFixed (2 ));
Certificate ('{g'{ I }.html (temp_f/yest_f) * 100). toFixed (2) + "% ");
}
('{H'{ I }.html (temp3.split (',') [4]);
('{ I '{ I }.html (temp3.split (',') [5]);
}
}
});
}
$ (Document). ready (function ()...{
Var stocks = $ ("# stockinit"). val (). split (',');
For (var I = 0; I <stocks. length; I ++ )...{
AddRows ();
}
$ ("# Insrow"). click (function ()...{
Var stockcd = $ ("# stockid"). val ();
If (stockcd = "")...{
Alert ("The Stock Code cannot be blank! ");
$ ("# Stockid"). focus ();
Return;
}
If (stockcd. length! = 6 )...{
Alert ("the stock code can only be 6 digits! ");
$ ("# Stockid"). focus ();
Return;
}
Var div = 'sh ';
If (document. getElementById ("sz_id"). checked)... {div = "sz ";}
Var stocks = $ ("# stockinit"). val ();
$ ("# Stockinit"). val (stocks + "," + div + stockcd );
AddRows ();
});
$ ("# Delrow"). click (function ()...{
Var table = document. getElementById ("tableId ");
Var index = table. rows. length;
If (index <2 )...{
Alert ("No rows can be deleted! ");
} Else ...{
Table. deleteRow (index-1 );
Var stockvalue = $ ("# stockinit"). val ();
Var count = stockvalue. split (','). length;
If (count = 1 )...{
Stockvalue = "";
} Else ...{
Stockvalue = stockvalue. substr (0, stockvalue. length-9 );
}
$ ("# Stockinit"). val (stockvalue );
}
});
Windows. setInterval ("ajaxRequest ()", 3000 );
});
Function addRows ()...{
Var table = document. getElementById ("tableId ");
Var index = table. rows. length;
Var str = "";
Var row = index-1;
Str + = '<tr class = "tr_cls">'
Str + = '<td align = "center"> <span id = "' +" a "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" B "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" c "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" d "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" e "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" f "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" g "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" h "+ row + '"> </span> </td>'
Str + = '<td align = "center"> <span id = "' +" I "+ row + '"> </span> </td>'
Str + = '</tr> ';
$ ("# Tablebody"). append (str );
}
</Script>
<Style>...
. Tr_cls {...}{
Height: 30px;
Font-size: 16px;
Font-family: "Times New Roman", Times, serif;
Background-color: # FFFFCC
}
</Style>
</Head>
<Body>
<Form>
<Input type = "hidden" id = "stockurl" value = "http://hq.sinajs.cn/list="/>
<Input type = "hidden" id = "stockinit" value = "sh000001, sz399001, sh601939, sh600016, clerk, sh600667, sh601390, sh601857, sz000532, sh600019, sh601111, clerk, sh601006, sh60133, sh601398, sh601988, sh601328 "/>
<Table width = "800" border = "0" align = "center" cellpadding = "0" cellspacing = "0">
<Tr>
<Td width = "115px">
Code: <input type = "text" id = "stockid" size = "6">
</Td>
<Td width = "150px">
Differentiation: shanghai <input type = "radio" name = "rad" id = "sh_id" checked> deep evidence <input type = "radio" name = "rad" id = "sz_id">
</Td>
<Td width = "40px">
<Input type = "button" id = "insrow" value = "Row appending">
</Td>
<Td width = "495px">
<Input type = "button" id = "delrow" value = "Row pruning">
</Td>
</Tr>
<Tr>
<Td colspan = "4">
<Div style = "overflow-y: scroll; overflow-x: auto; height: 392px; width: 817px">
<Table id = "tableId" width = "800" border = "1" align = "center" cellpadding = "0" cellspacing = "0" bordercolor = "#000000">
<Tr bgcolor = "# 3399FF" height = "30px">
<Th scope = "col"> stock code </th>
<Th scope = "col"> stock name </th>
<Th scope = "col"> current price </th>
<Th scope = "col"> opened today </th>
<Th scope = "col"> close yesterday </th>
<Th scope = "col"> current price difference </th>
<Th scope = "col"> increase/decrease </th>
<Th scope = "col"> maximum price </th>
<Th scope = "col"> lowest price </th>
</Tr>
<Tbody id = "tablebody">
</Tbody>
</Table>
</Div>
</Td>
</Tr>
</Table>
</Form>
</Body>
</Html>