2016-10-01 2 views
-6

タイトルによれば、次のコードはwokringではなく、私はなぜそれがわかりません。Javascriptコードが機能していません。なぜ誰が知っていますか?

HTML:

<html> 
    <head> 

    </head> 
    <body> 
    <form> 
     <input type="textbox" class="probe"></input> 
    <button class="probar">h</button> 
    </form> 
    <p id="pu">h<p> 
    </body> 
</html> 

JS:

$(document).ready(function(){ 
//Global variables 
    var poste = ""; 
    var wSearch= ""; 


$("probar").on("click",function(){ 
//Doing a JSON request to wikipedia api 
$.getJSON("https://en.wikipedia.org/w/api.php?action=opensearch&format=jsonfm&search=America&namespace=0&limit=10&redirects=resolve&format=json&callback=?", function(data) { 
//Triying to get the data returned. It doesn't works. 
    console.log(data); 
}); 
    }); 

}); 

だからはずの機能を使用すると、 "probar" ボタンをクリックしたとき、それはWikipediaのAPIからJSONを要求ということです、それはにそれを置きますコンソール。それで全部です。そして、それは動作していません。

誰でも助けてくれますか?

答えて

-1
<!DOCTYPE html> 
<html> 
<head> 
    <title>form</title> 
</head> 
<body> 
    <input id="txtQuery" type="text" /> 
    <button id="btnRequest">Request</button> 

    <pre id="txtResponse"><pre> 
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
    <script> 
    $(document).ready(function(){ 

      $("#btnRequest").click(function(){ 
       //Doing a JSON request to wikipedia api 
       $.getJSON("https://en.wikipedia.org/w/api.php?action=opensearch&format=jsonfm&search="+ $("#txtQuery").val() + "&namespace=0&limit=10&redirects=resolve&format=json&callback=?", function(data) { 
        $("#txtResponse").html(JSON.stringify(data,null,4)); 
       }); 
      }); 
    }); 
    </script> 
</body> 
</html> 
+0

さて、それは動作します!なぜか分かりませんが、ありがとうございます。 –

+0

回答しないでください。答えに問題がある場合は直接教えてください。 – asissuthar

1

あなたはJavaScriptをHTMLに関連付けるための何もしていません。あなたは$が定義されていないので、あなたがお使いのブラウザの開発ツールのコンソールで参照エラーが表示されますことをやるたら

<script src="foo.js"></script> 

:あなたはそのための<script>要素を必要としています。依存しているjQueryライブラリをロードするには別のスクリプト要素が必要です。

次に、selectorsについて学ぶ必要があります。

probarはタイプセレクタで、HTMLでは許可されていない要素と一致します。 「

は、クラスセレクタは.

+0

おかげで始まりますが、wihtコードペンIO作業イム、あなたはドンそれらを行う必要はありませんヘイ。 しかし、私はクラスセレクタを見逃しました、ありがとうございました。 –

0

HTML

<!DOCTYPE html/> 
<html> 
<head> 
<title></title 
<script src="javascript_file.js"></script> 
</head> 
<body> 
<form> 
<input type="textbox" class="probe"></input> 
<button class="probar">h</button> 
</form> 
<p id="pu">h<p> 
</body> 
</html> 

Javascriptを

$(document).ready(function(){ 
//Global variables 
var poste = ""; 
var wSearch= ""; 


$(".probar").on("click",function(){ // add dot begining class selector 
//Doing a JSON request to wikipedia api 
$.getJSON("https://en.wikipedia.org/w/api.php? action=opensearch&format=jsonfm&search=America&namespace=0&limit=10&redirects=resolve&format=json&callback=?", function(data) { 
//Triying to get the data returned. It doesn't works. 
console.log(data); 
}); 
}); 

}); 
+0

入力タイプのテキストボックス?選択のための – derloopkat

+0

?必要ありません –

関連する問題