Делать функцию по нажатию кнопки

Question

Делать функцию по нажатию кнопки

0

Мне сложно понять, как это решить. У меня есть поле ввода и кнопка отправки. Первое, что я хочу сделать, это изменить значение переменной на значение поля ввода при нажатии кнопки отправки.

Во-вторых, я хочу запустить функцию при нажатии кнопки отправки. case: Когда нажата кнопка отправки, я хочу получить 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.

Karsten Tietje 25 окт. 2013, в 00:03

Источник

Теги:

jquery

html

json

1 ответ

Ещё вопросы

Cooper Maruyama · Accepted Answer · 2013-10-24T18-52-00.000Z

Вам необходимо предотвратить действие по умолчанию события click:

$('#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());
  });

});

Кроме того, обратите внимание, что код, который делает поиск должен пойти внутри функции мыши, поскольку переменные должны быть обновлены после нажмите кнопку "Отправить".

Вам также нужно изменить URL после получения searchTerm из ввода. В противном случае это довольно бесполезно.
На самом деле я уже попробовал этот подход без удачи. Когда я нажимаю на кнопку, ничего не происходит, и я не могу понять, почему.
Извините, я был немного быстр там. После нажатия на кнопку JSON загружается. Но если я изменю значение в поле ввода и снова нажму, ничего не произойдет.
Это работает, но я думаю, что вы хотели сделать $("#result").html , а не $("#result").append . См. Fiddle : jsfiddle.net/5xGtE Кроме того, если вы введете недопустимый поисковый запрос, ничего не произойдет. Я поставил в "США", и он работает нормально.
Это работает. Я просто не думал прямо. Большое спасибо - мне потребовались дни, чтобы понять.