Aide au codage de panier

J'ai fait un simple code Javascript pour un panier mais maintenant j'ai réalisé que j'ai fait une erreur en le fabriquant et que je ne sais pas comment le réparer. Ce que j'ai est un fichier HTML avec le Javascript, mais dans le Javascript j'ai inclus la source d'images et les champs qui seraient normalement seulement dans le fichier HTML mais ce que j'essaye de faire maintenant est de faire 2 fichiers un fichier .HTML et un autre fichier .JS, mais ce que je veux, c'est un seul bouton qui ajoute au panier dans le fichier HTML.Aide au codage de panier

Pour l'instant, il a un bouton à côté de chaque élément, puis un bouton en bas. Je dois me débarrasser des boutons à côté de l'élément, mais je suis confus sur la façon de le faire, aussi j'ai besoin des images provenant du fichier HTML ainsi que les boîtes déroulantes, mais c'est aussi dans le javascript que je fais Je ne veux pas.

Ceci est mon fichier javascript avec le Javascript incorporé dedans. Je l'ai trouvé correctement dans mon HTML.

<SCRIPT type="text/javascript"> 
var items=['Xbox~149.99','StuffedGizmo~19.98','GadgetyGoop~9.97']; 

var M='�'; var product=[]; var price=[]; var stuff=''; 

function wpf(product,price){var pf='<form><FIELDSET><LEGEND>'+product+'</LEGEND>'; 
pf+='<img src="../images/'+product+'.jpg" alt="'+product+'" ><p>price   '+M+''+price+'</p> <b>Qty</b><SELECT>'; 
for(i=0;i<6;i++){pf+='<option value="'+i+'">'+i+'</option>'} pf+='</SELECT>'; 
pf+='<input type="button" value="Add to cart" onclick="cart()" /></FIELDSET></form>'; 
return pf 
} 

for(j=0;j<items.length;j++){ 
product[j]=items[j].substring(0,items[j].indexOf('~')); 
price[j]=items[j].substring(items[j].indexOf('~')+1,items[j].length); 
stuff+=''+wpf(product[j],price[j])+''; 
} 
document.getElementById('products').innerHTML=stuff; 

function cart(){ var order=[]; var tot=0 
for(o=0,k=0;o<document.forms.length;o++){ 
if(document.forms[o].elements[1].value!=0){ 
qnty=document.forms[o].elements[1].value; 
order[k]=''+product[o]+'_'+qnty+'*'+price[o]+''; 
tot+=qnty*price[o];k++ 
} 
} 
document.getElementById('inCart').innerHTML=order.join('<br>')+'<h3>Total '+tot+'</h3>'; 
} 
</SCRIPT>

Est-ce logique? Je ne suis pas sûr Si je me suis expliqué correctement.

Source

2010-05-07 user228390

ce qui est avec la balise "rapide"? – Kiril

S'il vous plaît clarifier votre question. – fbrereto

Eh bien, je veux un fichier HTML où j'ai la source de l'image avec le prix et la liste déroulante, mais je ne sais pas comment faire tout cela dans le javascript, mais je ne le veux pas. J'ai juste besoin du javascript pour appeler les fonctions. – user228390

La voici. Il y a beaucoup à améliorer, mais ça fonctionne.

fichier HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<HTML> 
<HEAD> 
    <TITLE>Shopping</TITLE> 
    <META http-equiv=Content-Type content="text/html; charset=UTF-8"> 
    <STYLE type=text/CSS> 
     fieldset {width:300px} 
     legend  {font-size:24px;font-family:comic sans ms;color:#004455} 
    </STYLE> 
</HEAD> 
<BODY scroll="auto"> 
    <div id="products"></div><hr> 
    <div id="inCart"></div> 
    <input type="button" value="Add to cart" onclick="cart()" /> 
</BODY> 
<SCRIPT type="text/javascript" src="cart.js"></SCRIPT> 
</HTML>

Javascript fichier:

var items = 
    [ 
     {'id':1, 'name':'Xbox',    'desc':'The best gaming console from Microsoft', 'price':149.99,  'image_src': '', 'qty':0}, 
     {'id':2, 'name':'Stuffed Gizmo', 'desc':'This gizmo is stuffed with stuff',    'price':19.98, 'image_src': '', 'qty':0}, 
     {'id':3, 'name':'Gadgety Goop', 'desc':'',              'price':9.00,  'image_src': '', 'qty':0} 
    ]; 

var M = '£'; 
var stuff = ''; 
var order = []; 
var tot = 0; 

for(j=0;j<items.length;j++) { 
    stuff+=''+wpf(j)+''; 
} 
document.getElementById('products').innerHTML=stuff; 

function wpf(j) { 
    var pf=''; 

    pf+='<form name="frm_cart_'+j+'">'; 
    pf+='<fieldset><legend>'+items[j].name+'</legend>'; 
    pf+='<img src="../images/'+items[j].image_src+'" alt="Image of '+items[j].name+'" >'; 
    pf+='<p>'+items[j].desc+'</p>'; 
    pf+='<p>Price:'+M+''+items[j].price+'</p>'; 
    pf+='<b>Qty</b>'; 
    pf+='<select id="qty_'+j+'">'; 
    for(i=0;i<6;i++) { 
     pf+='<option value="'+i+'">'+i+'</option>' 
    } 
    pf+='</select>'; 
    pf+='</fieldset>'; 
    pf+='</form>'; 
    return pf; 
} 

function cart() { 
    var sel_elems = document.getElementsByTagName('select'); 
    k=0; 
    for (i=0; i < sel_elems.length; i++) { 
     if (sel_elems[i].id.substring(0, 4) == 'qty_' && sel_elems[i].value > 0) { 
      console.log(i, sel_elems[i].value); 
      order[k]=''+items[i].name+'_'+sel_elems[i].value+'*'+items[i].price+''; 
      tot += sel_elems[i].value*items[i].price; 
      k++; 
     } 
    } 

    document.getElementById('inCart').innerHTML=order.join('<br>')+'<h3>Total '+tot+'</h3>'; 
}

Source

2010-05-08 17:00:26 Vanco

hmmm Ne semble pas fonctionner lorsque je clique sur ajouter au panier. J'ai essayé de trouver l'erreur mais je ne vois rien? – user228390

Quel type de navigateur utilisez-vous? Je l'ai essayé de Firefox 3.6 et Chromium (je suis sous Linux) et ça fonctionne parfaitement. Pouvez-vous voir s'il y a des erreurs dans Firebug ou dans la console JS? – Vanco

ça marche maintenant, merci pour l'aide – user228390

Avez-vous référencé les fichiers JS dans votre code HTML?

Source

2010-05-07 17:47:36

Non parce que c'est mon fichier HTML avec le Javascript dedans – user228390

L'erreur la plus commune lorsqu'ils traitent avec javascript externe pour la première fois est la suivante:

<script type="text/javascript" src="myscripts.js"/>

Dans ce cas, c'est invalide. Essayez ceci:

<script type="text/javascript" src="myscripts.js"></script>

Source

2010-05-07 17:51:45

Mettre le javascript dans un fichier séparé, à savoir cart.js

Ensuite, après l'étiquette, a mis cette déclaration:

<SCRIPT type="text/javascript" src="cart.js"></SCRIPT>

Il fonctionne sur mon fin.

Source

2010-05-07 18:41:13 Vanco

Ouais mais je veux le changer de sorte que je n'ai qu'un bouton Ajouter au panier, en ce moment j'ai un ajouter au panier à côté de chaque article – user228390

Aaaah! Maintenant je t'ai. – Vanco

Aide au codage de panier

Répondre

Questions connexes