功能onclick按钮

时间:2013-10-24 21:34:11

标签: jquery html json

我很难弄清楚如何解决这个问题。我有一个输入字段和一个提交按钮。我想做的第一件事是在单击提交按钮时将变量的值更改为输入字段的值。

其次我想在单击提交按钮时运行一个函数。他的情况:当点击提交按钮时,我想根据输入字段的值从维基百科检索一个json文件。

    <div class="container">
    <div class="row">
        <div class="span8"><p>Please enter your searchterm:</p>
        <input id="input" type="text"  value="Denmark"><br>
            <input type="button" id="submit" value="Search" />
        </div>
        <div class="span4"><div id="result"></div></div>
    </div>
 </div>


<script>
var searchTerm="";
var url="http://en.wikipedia.org/w/api.php?action=parse&format=json&page=" + searchTerm+"&redirects&prop=text&callback=?";

$('#submit').click(function (){
searchTerm='denmark';
});


$.getJSON(url,function fetchWiki(data){
  wikiHTML = data.parse.text["*"];
  $wikiDOM = $("<document>"+wikiHTML+"</document>");
  $("#result").append($wikiDOM.find('.infobox').html());
});

我无法弄清楚如何更改值并在此之后运行该函数。

请耐心等待,我对JavaScript相对较新。

1 个答案:

答案 0 :(得分:1)

您需要阻止点击事件的默认操作:

$('#submit').click(function (e){ //pass the event into the function
 e.preventDefault(); //prevent the submit button from actually submitting

 //update your variables
 searchTerm = $("#input").val();
 url="http://en.wikipedia.org/w/api.php?action=parse&format=json&page=" + searchTerm+"&redirects&prop=text&callback=?";


 $.getJSON(url,function fetchWiki(data){
   wikiHTML = data.parse.text["*"];
   $wikiDOM = $("<document>"+wikiHTML+"</document>");
   $("#result").append($wikiDOM.find('.infobox').html());
  });

});

另外,请注意,执行搜索的代码需要 点击功能,因为变量需要更新 后点击&#34;提交& #34;