Замените два входных текстовых значения на значения друг от друга при нажатии кнопки - PullRequest
Новая
       28

Замените два входных текстовых значения на значения друг от друга при нажатии кнопки

0 голосов
/ 17 мая 2011

У меня есть html-форма с двумя полями ввода, в первом один пользователь вводит название первого города, а в другом втором городе, после отправки формы, пользователи получают инструкции о том, как пройти из первого города во второй.

Я хочу, чтобы пользователь мог нажать кнопку «Изменить направление» и автоматически изменить название первого города на имя второго и второго города на первое и наоборот. (От A до B, от B до A)

Полагаю, я должен использовать javascript, но я новичок в этом и нигде не могу понять.

Может кто-нибудь помочь мне, пожалуйста? 

input type="text" size="25" id="fromAddress" name="from"
 value=""/>
  <input name="submit1" type="submit" value="Change directions" />
<input type="text" size="25" id="toAddress" name="to"
 value="" />
<input name="submit" type="submit" value="OK" />

Ответы [ 3 ]

3 голосов
/ 17 мая 2011

Вы можете создать новую кнопку <button id="change">Change</button>
А затем добавьте к нему событие onclick. 

document.getElementById('change').onclick = function() {
    var tmp = document.getElementById('fromAddress').value;
    document.getElementById('fromAddress').value = document.getElementById('toAddress').value;
    document.getElementById('toAddress').value = tmp;
};

Взгляните сюда: http://jsfiddle.net/xskKn/

1 голос
/ 17 мая 2011

Ниже приведен пример кода того, чего вы хотите достичь:)

</p> <pre><code> function swap1() { var data1 = document.getElementById("fromAddress").value; var data2 = document.getElementById("toAddress").value; document.getElementById("fromAddress").value = data2; document.getElementById("toAddress").value = data1; document.getElementById("swap_button").onclcik = function () {swap2()}; } function swap2() { var data1 = document.getElementById("toAddress").value; var data2 = document.getElementById("fromAddress").value; document.getElementById("toAddress").value = data2; document.getElementById("toAddress").value = data1; document.getElementById("swap_button").onclcik = function () {swap2()}; } <input type="text" size="25" id="fromAddress" name="from" value=""/> <input id="swap_button" type="button" value="Change directions" onclick="swap1()" /> <input type="text" size="25" id="toAddress" name="to" value="" /> <input name="submit" type="submit" value="OK" />

0 голосов
/ 17 мая 2011

Я бы порекомендовал jQuery, если вы новичок. 

jQuery('#submit1').click(function() {
     var fromAddress = jQuery('#fromAddress').val();
     var toAddress = jQuery('#toAddress').val();

     jQuery('#fromAddress').val('toAddress');
     jQuery('#toAddress').val('fromAddress');
});

Это лишь краткий пример того, как вы могли бы это сделать.Вам понадобится библиотека jQuery, и я бы порекомендовал базовые знания по jQuery.

http://jquery.com/

...