title: How do I get the changed slider value in javascript
body: <p><a href="http://jsfiddle.net/63BhY/" rel="nofollow">http://jsfiddle.net/63BhY/</a></p>
  
  <p>I got a strange problem. I have a slider with a starting value. But when I change the value of the slider (by sliding it). My slider value in javascript isn't updated. How is it possible to let this work.</p>
  
  <p>The var 'aantal' has to be the value of the slider. </p>
  
  <pre><code>//&lt;![CDATA[ 
  
  $(function(){
  /// first off wrap all our code in our own scope, this means we keep our vars
  /// to ourselves and don't mess up anyone elses code - doesn't usually matter
  /// with your own app, but good practice is good practice.
  
      (function(){
          /// Hiermee kun je de lengte van je oefening bepalen.
          //var aantal = prompt("Tot hoever wil je oefenen? Geef een nummer op.");
  
          var aantal = $('#slider1').val();
  
          /// might as well store an array with each answer, could be improved
          /// by storing the question as well - so in the end you could give
          /// the user a summary.
          var antwoordenAnswers = [];
          var antwoordenPartituur = 0;  /// store the score count
          var antwoordVerwacht = null; /// keep a reference to the expected answer
          /// reformatted your arrays to better fit with SO layout ;)
  
          // all special characters: http://kompoos.nl/manuals/ascii/javascript-special-characters.html
          // \337 = ß
          // \374 = ü
              var vierdeNaamval = [
                  "bis", "durch", "f\374r", "gegen",
                  "ohne", "um", "entlang"
              ],
              derdeNaamval = [
                  "aus", "bei", "mit", "nach", "seit",
                  "von", "zu", "entgegen", "au\337er",
                  "gegen\374ber", "an...vorbei"
              ],
              keuzevoorzetsel = [
                  "an", "auf", "hinter", "neben", "in",
                  "\374ber", "unter", "vor", "zwischen"
              ];
  
          /// added some translation vars for English people 
          /// out there (and to help me)
          var accusative = vierdeNaamval,
              dative = derdeNaamval,
              choicePreposition = keuzevoorzetsel;
  
          /// to aid with a random choice it's nice to work with arrays
          var opties = [vierdeNaamval, derdeNaamval, keuzevoorzetsel];
          var options = opties;
  
          /// ... then we can use a function like this to grab a random item
          var getRandomItem = function( a ){
              return a[Math.floor((a.length)*Math.random())];
          };
  
          /// handle writing the question, as stated 
          /// by @AvlinWong - don't use document.write()
          var vraagQuestion = function(){
              /// use our simple get random item from array function
              var a = getRandomItem( opties );
              /// set the expected answer
              if ( a === derdeNaamval ) {
                  antwoordVerwacht = '3';
              }
              else if ( a === vierdeNaamval ) {
                  antwoordVerwacht = '4';
              }
              else if ( a === keuzevoorzetsel ) {
                  antwoordVerwacht = 'k';
              }
              /// choose a random question item from the list
              var b = getRandomItem( a );
              /// target the output element and change it's HTML
              document.getElementById('antwoord').innerHTML = b;
          };
  
          /// a simple function to better explain the act of updating the score
          /// in the GUI/HTML.
          var zettenPartituur = function( a ){
             document.getElementById('partituur').innerHTML = a;
          };
  
          /// clickOnTheButton --- hope the translation is right :)
          var klikOpDeKnop = function(e){
              /// because we are relying on pure javascript, different browsers
              /// have different event objects - srcElement for old IE, target
              /// for everything else...
              var a = e.target ? e.target : e.srcElement;
              var corrigeren = null;
              /// because each button has a unique id, we can do this
              switch ( a.id ) {
                  case 'derde':
                      corrigeren = ( antwoordVerwacht == '3' );
                  break;
                  case 'vierde':
                      corrigeren = ( antwoordVerwacht == '4' );
                  break;
                  case 'keuze':
                      corrigeren = ( antwoordVerwacht == 'k' );
                  break;
              }
              /// if they were correct, tell them so and update score
              if ( corrigeren ) {
                  //alert('good!');
                  antwoordenPartituur++;    
                  document.getElementById('goed').style.visibility="visible";
                  document.getElementById('fout').style.visibility="hidden";
              }
              /// otherwise tell them not and downgrade score :(
              else {
                 // alert('wrong!');
                  antwoordenPartituur--;
                  document.getElementById('goed').style.visibility="hidden";
                  document.getElementById('fout').style.visibility="visible";
  
              }
  
              /// collect the answer
              antwoordenAnswers.push( corrigeren );
              /// output the score to the user
              zettenPartituur( antwoordenPartituur );
              /// because we are storing an array of answers it's easy
              /// to tell how many there have been by .length of the array
              //if ( antwoordenAnswers.length &gt; 10 ) {
                if ( antwoordenPartituur &gt;= aantal ) {    
                  /// all done!
                  alert("Hoera! Je bent klaar!! / You're done!!");
              } else {
                  /// generate a new question
                  vraagQuestion();
              }
          }
          /// using a simple window.onload will mean we know that we can
          /// start messing around with the HTML on the page. This could
          /// be improved using addEventListener/attachEvent but as this
          /// is your own app with bespoke code you don't need to worry.
          /// Unless you start using any plugins or third-party libraries.
          window.onload = function(){
  
              /// target the button wrapper in the HTML
              var wikkelWrapper = document.getElementById('buttons'),
                  /// find all buttons within wrapper
                  knoppenButtons = wikkelWrapper.getElementsByTagName('button'),
                  i, l = knoppenButtons.length, a;
  
              /// step each button found and apply an event listener using the
              /// more accepted and improved addEventListener/attachEvent methods
              /// there are many reasons as to why these are better to use
              /// just search StackOverflow for reasons as to why :)
              for(i=0; i&lt;l; i++){
                  a = knoppenButtons[i];
                  /// for all good browsers
                  if ( a.addEventListener ) {
                      a.addEventListener('click', klikOpDeKnop);
                  }
                  /// for good ol' Internet Explorer
                  else if ( a.attachEvent ) {
                      a.attachEvent('onclick', klikOpDeKnop);
                  }
              };
  
              /// set the ball rolling / stelt u de bal aan het rollen
              /// first set the output of the score
              zettenPartituur(antwoordenPartituur);
              /// then set the first question
              vraagQuestion();
  
          }
  
      })(); /// this construction can be confusing, it basically just creates
      /// a new anonymous function and then executes it straight away. we are
      /// using the anon function for it's scope so that we keep our variables
      /// and methods separated from other code.
  });//]]&gt; 
  </code></pre>