javascript comment faire pour exécuter la même fonction onLoad et onChange

J'ai un formulaire qui a beaucoup de sélectionner les menus, la plupart d'entre eux sont Oui/Non et selon l'option sélectionnée, afficher/masquer les options avancées. L'un de l'sélectionnez le menu est le suivant:

<td><%= f.select :CBIAvailable, ['Yes' , 'No'],{}, {:id=>"cbi_available_id", :class=>"cbi_available_class", :onChange=>"showHideOptions('cbi_available_id','cbi_options_id')", :onLoad=>"showHideOptions('cbi_available_id','cbi_options_id')"} %></td>

Quand je change de " Oui " à "Non", ou le contraire, showHideOptions fonctions javascript est appelée correctement, mais je ne peux pas avoir cette fonction à appeler lorsque je recharge le formulaire.

Quelqu'un peut me dire ce que je suis dong mal?

Grâce

Mise à JOUR

<script language="javascript" type="text/javascript">
function showHideOptions(selectorId,optionsId) {
  if (document.getElementById) {
    var selector = document.getElementById(selectorId);
    var options = document.getElementById(optionsId);
    if (selector.value == 'Yes') {
        options.style.display = 'block';
        return false;
    } else {
      options.style.display = 'none';
        return false;
    }
}

window.onLoad = showHideOptions('cbi_available_id','cbi_options_id');
Je ne comprends pas. Onload est appelée lorsque le formulaire est (re)chargement. Qu'attendiez-vous?
dans mon cas, :CBIAvailable = 'No', donc j'attends showHideOptions la fonction à exécuter lorsque je recharge le formulaire, et il doit afficher les options de "Non", mais en fait la forme de la recharge avec les options de 'Oui'. Lorsque je modifie le menu sélectionner "Non", il fonctionne très bien, et quand j'ai changer de nouveau à "Non", il fonctionne aussi bien. Le problème est qu'il n'affiche pas les bonnes options onload

OriginalL'auteur rh4games | 2012-03-28

  1. 1
    function yourFunction(){

    //get that select element and evaluate value
    //do you change stuff here
}

window.onload = yourFunction;   //this gets fired on load

//"select" is your element, 
//fetched by methods like document.getElementById();

select.onchange = yourFunction; //this gets fired on change

//you can also use attachEvent (IE) or addEventListener (Others)

    voici un travail de démonstration:

    <select id="testSelect">
    <option value="yes">YES</option>
    <option value="no">NO</option>
</select>​​​​​

function getOption() {
    alert('foo');
}

var select = document.getElementById('testSelect');
select.onchange = getOption;
window.onload = getOption;

    Merci Joseph. J'ai mis à jour ma question ci-dessus avec les modifications proposées, mais il ne fonctionne toujours pas correctement lorsque je recharge le formulaire. Il fonctionne bien quand j'ai changer l'option du " Oui " à "Non", et l'inverse.
    mise à jour de ma réponse
    Ne fonctionne toujours pas. En fait, avec la syntaxe d'origine, la fonction n'feu onload (je l'ai testé par l'ajout d'un document.wrtie l'intérieur de la fonction), mais il ne fait pas le reste comme lorsque je sélectionne " Oui " ou "Non"
    mise à jour, et maintenant, avec une démo d'un des corrections 😀
    J'ai enfin trouvé comment résoudre mon problème. J'ai dû mettre la fenêtre.onload ligne dans un <script></script> à la fin du fichier, après la forme. Je suppose que la façon de la fenêtre.onload est exécuté après la forme des charges et, par conséquent, fonctionne très bien. Lorsque la fenêtre.onload est dans un <script></script> dans le haut du fichier, document.getElementById(selectorId) points à null et donc n'a pas de valeur à tester.

    OriginalL'auteur Joseph

  2. 0

    Cela peut se produire lorsque vous recevez publication de votre serveur distant et votre réponse n'a pas <script type="javascript">... yourfunction()...</script>.

    Chaque fois que vous obtenez une nouvelle réponse, vous devez envoyer le script et exacute ou ajouter à votre élément html approciate gestionnaire d'événement.

    Une autre solution est d'utiliser jQuery et l'utilisation .live() événement. Cet événement attacher dynamiquement le comportement de votre code html. Je vous recommande fortement de l'utiliser jQuery avec live car cette bibliothèque est l'une des la plupart des bibliothèques utilisées dans l'environnement de production.

    Modifier

    <script type="text/javascript" src="path_to_jquery.js"></script>
<script type="text/javascript">
function showHideOptions(id1,id2){
    //Your code
}
$(document).ready(function() {
   //This function waits for DOM load
   //execute your function for first time
   showHideOptions('cbi_available_id','cbi_options_id');
   //This selector you have to modify or show us generated html to
   //choose the best selector for this purpose
   $('.cbi_available_class').live('change',function(){
        //This will fire change event of html class="cbi_available_class"
        showHideOptions('cbi_available_id','cbi_options_id');
   });
 });
</script>
    Merci r.piesnikowski. J'ai <script language="javascript" type="text/javascript"> function showHideOptions(selectorId,optionsId) { ... } </script> Pouvez-vous s'il vous plaît aider avec un exemple de script jQuery qui utilise /live()?
    Notez que Jquery live() est dépréciée en JQuery 1.7 et supprimées à partir de 1,9

    OriginalL'auteur r.piesnikowski