Пазарска количка
Реших да напиша един урок "пазарска количка" базирам на JavaScript надявам се да ви е полезно.

Започваме с файла Store.htm
От там избираме какви стоки да закупим

<html>

<head>
<title>Описание на страницата</title>

<script language="JavaScript">
<!--
function addItem( name, price )
{
var i = 1;
for( ; getCookieValue( "item" + i ) != "" ; i++ );
document.cookie = "item" + i + "=" + name + "," + price;
document.cookie = "items=" + i;
}

function getCookieValue( name )
{
var c = document.cookie;
var begin = c.indexOf( name );
if( begin < 0 ) return( "" );
begin += name.length + 1;
var end = c.indexOf( ";", begin );
if( end == -1 ) end = c.length;
return( c.slice( begin, end ) );
}

function setCustoms()
{
var bg = getCookieValue( "bgColor" );
var fg = getCookieValue( "fgColor" );
if( bg != "" ) document.bgColor = bg;
if( fg != "" ) document.fgColor = fg;
}
// -->
</script>
</head>

<body onLoad="JavaScript: setCustoms();">
Хайде купете си.<br><br>

<form>
<table border="2" width="100%">
<tr>
<td>Шапка</td>
<td>
$9.99</td><td align="center">
<input type="button" value="Add" onClick="JavaScript: addItem( Шапка.', 9.99 );">
</td>
</tr>
<tr>
<td>Тениска</td>
<td>
$19.99</td><td align="center">
<input type="button" value="Add" onClick="JavaScript: addItem( Тениска.', 19.99 );">
</td>
</tr>
<tr>
<td>Билети за мач</td>
<td>
$12.99</td><td align="center">
<input type="button" value="Add" onClick="JavaScript: addItem( Билети за мач', 12.99 );">
</td>
</tr>
<tr><td colspan="3" align="center">
<input type="button" value="View Cart" onClick="JavaScript: document.location='ViewCart.html';">
     
<input type="button" value="Check Out" onClick="JavaScript: document.location='CheckOut.html';">
</td></tr>
</table>
</form>
</body>

</html>


Следващата стъпка е файла viewcart.htm
От тук избирате как да продължите поръчката си.

<html>

<head>
<title>Описание ....</title>

<script language="JavaScript">
<!--
function removeItem( name )
{
document.cookie = name + "=;";
document.location = document.location;
}

function getCookieValue( name )
{
var c = document.cookie;
var begin = c.indexOf( name );
if( begin < 0 ) return( "" );
begin += name.length + 1;
var end = c.indexOf( ";", begin );
if( end == -1 ) end = c.length;
return( c.slice( begin, end ) );
}

function getItemName( item )
{
var c = getCookieValue( item );
if( c )
{
return( c.split( "," )[0] );
}
else return( "" );
}

function getItemPrice( item )
{
var c = getCookieValue( item );
if( c )
{
return( c.split( "," )[1] );
}
else return( "" );
}

function setCustoms()
{
var bg = getCookieValue( "bgColor" );
var fg = getCookieValue( "fgColor" );
if( bg != "" ) document.bgColor = bg;
if( fg != "" ) document.fgColor = fg;
}
// -->
</script>
</head>

<body onLoad="JavaScript: setCustoms();">
Как сте пичове<br><br>

<form>
<table width="100%" border="2">
<script language="JavaScript">
<!--
for( i = 1 ; i <= parseInt( getCookieValue( "items" ) ) ; i++ )
{
if( getItemName( "item" + i ) != "" && getItemPrice( "item" + i ) != undefined )
{
document.write( "<tr><td>" );
document.write( getItemName( "item" + i ) + "</td><td>" );
document.write( "$" + getItemPrice( "item" + i ) + "</td><td align='center'>" );
document.write( "<input type='button' value='Remove' onClick='JavaScript: removeItem( \"item" + i + "\" );'>" );
document.write( "</td></tr>" );
}
}
// -->
</script>
<tr><td colspan="3" align="center">
<input type="button" value="Keep Shopping" onClick="JavaScript: document.location='Store.html';">
     
<input type="button" value="Check Out" onClick="JavaScript: document.location='CheckOut.html';">
</td></tr>
</table>
</form>
</body>

</html>


И най-накрая checkout.html
Вашите разходи се калкулират тук.

<html>

<head>
<title>и тук си сложете описание</title>

<script language="JavaScript">
<!--
var total = 0;

function getCookieValue( name )
{
var c = document.cookie;
var begin = c.indexOf( name );
if( begin < 0 ) return( "" );
begin += name.length + 1;
var end = c.indexOf( ";", begin );
if( end == -1 ) end = c.length;
return( c.slice( begin, end ) );
}

function getItemName( item )
{
var c = getCookieValue( item );
if( c )
{
return( c.split( "," )[0] );
}
else return( "" );
}

function getItemPrice( item )
{
var c = getCookieValue( item );
if( c )
{
return( c.split( "," )[1] );
}
else return( "" );
}

function fixTotal( n )
{
n *= 100;
var good = parseInt( n );
while( good < n ) good += 1;
return( good / 100 );
}

function setCustoms()
{
var bg = getCookieValue( "bgColor" );
var fg = getCookieValue( "fgColor" );
if( bg != "" ) document.bgColor = bg;
if( fg != "" ) document.fgColor = fg;
}
// -->
</script>
</head>

<body onLoad="JavaScript: setCustoms();">
<b><font size="6">Иьааа-</font></b>
<font size="4">К'во?</font><br><br>

<form>
<table width="100%" border="2">
<script language="JavaScript">
<!--
for( i = 1 ; i <= parseInt( getCookieValue( "items" ) ) ; i++ )
{
if( getItemName( "item" + i ) != "" && getItemPrice( "item" + i ) != undefined )
{
document.write( "<tr><td>" );
document.write( getItemName( "item" + i ) + "</td><td>" );
document.write( getItemPrice( "item" + i ) );
document.write( "</td></tr>" );

total += parseFloat( getItemPrice( "item" + i ) );
}
}
// -->
</script>
<tr>
<td><b>Total</b></td>
<td>$
<script language="JavaScript">
<!--
document.write( fixTotal( total ) );
-->
</script>
 </td>
</tr>
</table>
</form>
</body>

</html>


Демонстрация на всичко : http://pazarskakoli4ka.hit.bg/Store.html

За всякакви препоръки към урока , въпроси и т.н пишете в него :)





/ Трябва да сте регистриран за да напишете коментар /
От: maginka87
15:50 26-04-2010
нещо не ми тръгва :(
От: etori
14:29 23-05-2010
и на мен
1