2017-02-04 13 views
0

jQueryスクリプトを使用しようとしていますが、表示されていないようです。私はそれを働いているwithin JSFiddle。しかし、私のページ内では機能しません。オプションが選択されても、何も表示されません。私は間違って何をしていますか?jQueryスクリプトがHTMLページで機能しない

<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>title</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <link href="css/faqtest.css" rel="stylesheet"> 
    </head> 
    <body> 
    <script type="text/javascript"> 
    $('select').on('change',function() { 
     var answer = $(this).val(); 
     $('.answers').hide(); 
     $('#'+answer).show(); 
    }) 
    </script> 
    <select> 
     <option disabled selected>choose</option> 
     <option value="answer1">answer1</option> 
     <option value="answer2">answer2</option> 
     <option value="answer3">answer3</option> 
    </select> 
    <div class="answers" id="answer1">answer1</div> 
    <div class="answers" id="answer2">answer2</div> 
    <div class="answers" id="answer3">answer3</div> 
    </body> 
</html> 
+0

スクリプト実行時に選択した要素はありません。 – Teemu

+0

あなたのコードを '$(document).ready()'の中に入れてください。 – Barmar

答えて

2

document readyでコードを実行します。

$(function(){ 
    $('select').on('change',function() { 
    var answer = $(this).val(); 
    $('.answers').hide(); 
    $('#'+answer).show(); 
    }); 
}); 
関連する問題