Скопируйте значение из ввода и выберите в div

0

У меня есть форма с вводом [текст], select и textarea, клонирование или копирование данных/значений ввода (тип = текст), выбор, textarea в div или span, другими словами, в HTML.

И это должно произойти без обновления или перезагрузки страницы. Другими словами, если я напечатаю что-то в: <input type="text" name="f_name" value="Small john"/>

Я хочу увидеть текст "Маленький Джон" в

<span id="first_name">{here is the value of the field name}</span>

или если я выбираю вариант формы списка выбора, и этот параметр имеет значение id "499", а его содержимое "США", то я хочу, чтобы США отображалось в диапазоне, например, с id = "Country_name".

Я предполагаю, что все это сделано с jquery/JS. Поэтому я сделал это FIDDLE, для тех, кто хотел бы попробовать!

  • 2
    Вопросы о коде должны демонстрировать минимальное понимание решаемой проблемы. Включите попытки решения, почему они не сработали, и ожидаемые результаты.
  • 0
    Ну, да, спасибо за вашу точку зрения! Я думаю, ты счастлив!
Теги:

3 ответа

2
Лучший ответ

Попробуй это

$("input[name=f_name]").on('keyup', function () {
    $('#first_name').html($(this).val());
});
$("select[name=country]").on('change', function () {
    $('#Country_name').html($(this).find('option:selected').text());
});

использование

  • $(this).find('option:selected').text() если вы хотите выбрать текст
  • $(this).find('option:selected').val() если вы хотите выбрать значение

Обновленная демоверсия

  • 0
    Ну, круто, это работает для ввода! но как сделать это для выбора?
  • 0
    Да, но он копирует все значения из списка выбора, а не из выбранного. Я плохо с JS и не знаю, как исправить .. Если вы можете, пожалуйста, спасибо в любом случае за вашу огромную помощь
Показать ещё 1 комментарий
0

Серджио был на правильном пути. К сожалению, он не совсем испытал его решение. Это работает...

http://jsfiddle.net/WLZyn/2

$('button').click(function(){
    $('#first_name').html($('input[name=f_name]').val());
    $('#Country_name').html($('select[name=country] option:selected').text());
});


Итак, на самом деле (по некоторым по-настоящему странным причинам), это...

$('select[name=country] option:selected').text()
получает текст выбранного варианта

$('select[name=country]').val()
получает значение выбранного параметра

0

Попробуй это:

$('button').click(function(){
    $('#first_name').html($('input[name=f_name]').val());
    $('#Country_name').html($('select[name=country] option:selected').text());
});

Демо здесь

Этот $('input[name=f_name]').val() получает значение ввода.
Этот текст .text() получает текст выбранной опции.
Этот .val() получает значение выбранного параметра.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню