pourquoi ce javascript est la ligne est droite et l'autre n'est pas

Question

javascript avec>

var customer=document.getElementById('custList').value; 

et qui fonctionne ...

Pourquoi ça marche ... MAIS

var customer=(form1.custList.value); 

Je reçois une erreur indiquant que form1 n'est pas défini.

Surtout pourquoi cela fonctionnerait dans IE, et Chrome, mais pas Firefox. Il semble juste que moi clairement, mais je ne suis pas un moteur de script

essaie de comprendre

Answer 1

Si vous souhaitez faire référence à un objet de formulaire dans votre page, vous pouvez utiliser l'objet 'document.forms', c'est-à-dire un tableau d'objets de formulaire dans le document. supposons que nous avons une forme comme ceci:

<form method="post" action="somthing.php" name="myContactForm" id="contact_form"> 
    <input type="text" name="custList" id="custListId" /> 
</form> 

pour accéder à la valeur d'une manière correcte, vous pouvez utiliser l'une de ces méthodes: première acccess la forme, l'élément.

var form = document.forms['myContactForm']; // use the 'name' attribute as the array key 

// or if this is the first form appeared in the page. otherwise increase the index number to match the position of your target form. 
var form = document.forms[0]; 

// or access the form directly 
var form = document.getElementById('contact_form'); 

// now get the element, from the form. you can access form elements, by using their name attribute as the key in the elemetns array property of the form object. 
var cust = form.elements['custList'].value(); 

ou vous pouvez accéder à un élément de formulaire directement, sans aucune forme. vous pouvez référencer n'importe quel élément du document par son identifiant, directement. Aucune forme n'est nécessaire ici.

var cust = document.getElementById('custListId'); 

toutes ces déclarations sont valables JavaScript qui fonctionnent sur IE, Firefox, Opera, Chrome, etc. cependant vous pouvez vous référer à un objet de forme dans IE, simplement appeler son attribut « nom ». si cette ligne fonctionne dans IE (et comme vous dites, le chrome je ne savais pas que le chrome gère.):

var cust = myContactForm.custList.value(); 

IE tente de cartographier les propriétés de niveau de fenêtre inconnue (comme myContactForm) à des éléments en faisant correspondre à leur attribut 'name'.

Answer 2

Je crois que IE/Chrome/Opera interpréter correctement id = « form1 » comme name = « form1 » (ou vice versa?) pour prendre en compte le balisage hérité.

Je pas comptent sur la propriété de niveau 0 dom accès tels que form1.custList et utiliser à la place document.getElementById. Si elle est trop long à taper, définir une méthode pour le faire .. par exemple

function getId(id) { return document.getElementById(id) } 

Answer 3

Parce que le deuxième idiome n'est pas standard, alors que getElementById est, il doit être pris en charge par tous les navigateurs dire que javascript est-il compatible . En outre, le second devrait être, si je ne me trompe, document.form1.custList.value.

Answer 4

Internet Explorer a fait beaucoup de choses à sa façon. Par tous les moyens, la première façon est la bonne façon (en utilisant getElementById).
Pour la rétrocompatibilité, beaucoup de ces "bogues" fonctionnent toujours, mais vous ne devriez pas les utiliser.
Il existe encore des différences entre les navigateurs. Utilisation d'un framework JavaScript (comme jQuery) aide beaucoup ici, il est écrit pour bien fonctionner cross-browser (pour l'enregistrement, votre code sera $('#custList').val(); en utilisant jQuery)

Answer 5

Internet Explorer place tous vos éléments de formulaire par nom dans l'objet window en tant que propriétés, ce qui est fragile, incompatible, difficile à utiliser avec finesse - et ce qui rend votre deuxième exemple de travail. Les autres navigateurs prennent simplement la route propre de ne pas implémenter cette interface du tout, vous laissant avec les fonctions DOM appropriées. Ou une boîte à outils. jQuery est vraiment sympa. ;)