JQuery, заменяющий элементы формы текстом

Я в ситуации, когда мне нужно преобразовать свои заполненные формы в текст перед отправкой.JQuery, заменяющий элементы формы текстом

Как, например, форма может иметь поле имени и поле электронной почты. Я заполнить форму с деталями, то когда я нажимаю экспорт как текст, мне нужно, чтобы получить содержимое HTML в текстовом формате

name = <input type="text" name="name" /> <!-- user enters "john" --> 
email = <input type="text" name="email" /> <!-- user enters [email protected] -->

при экспорте мне нужно

name = john 
email = [email protected]

В настоящее время я я использую этот код для преобразования. Но проблема в том, что после конвертации я не смогу вернуться к предыдущему состоянию.

$("#btn").click(function(){ 
    $('.replace').replaceWith(function(){ 
     return this.value 
    }); 
});

Итак, что я думал, я покажу вывод в теге div. Но если я попробую

document.getelementByID("parentdiv").value

Я не могу получить значения формы.

Любые предложения, пожалуйста?

Update:

сериализации не работает, как ожидалось. Это один из примеров. Форма настолько сложна, и мне нужно визуально визуализировать значения формы для ее меток.

источник

2015-01-06 Bala

значения уже являются строками/текст? – devqon

Считаете ли вы ['.serialize()'] (http://api.jquery.com/serialize/)? – Spokey

Я не использую форму для отправки, я использую ее для создания некоторого контента. – Bala

$x = $('form').serialize();

Это даст вам строку элементов и значений, которые вы можете легко работать с, он предназначен для использования в качестве JSON, однако для ваших целей она должна быть довольно легко бегать вокруг.

Это даст вам результат, похожий на

имя = John & х = у

источник

2015-01-06 13:09:26

Не собирался упоминать, что это не массив, но если вы хотите, чтобы массив использовал [.serializeArray()] (http://api.jquery.com/serializearray/) – Spokey

Да, мои плохие, исправлены :) –

попробовать как это с помощью serializeArray():

$("#btn").click(function(){ 
 
\t \t var x = $('form').serializeArray(); 
 
\t \t console.log(x); 
 
\t \t var str=""; 
 
\t \t $.each(x, function(index, val) { 
 
\t \t \t str=str+val.name+":"+val.value+"<br>"; 
 
\t \t \t }); 
 
\t  $('#textFrom').html(str); 
 
\t \t });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
name =<input type="text" name="name" /> <!--user enters "john"--> 
 
email =<input type="text" name="email" /> <!--//user enters [email protected]> 
 
</form> 
 
<button id="btn">click</button> 
 
<div id="textFrom"></div>

источник

2015-01-06 13:30:43

Спасибо, Это полезно.Но форма имеет более 150 + элементов, мне придется снова визуализировать ее с помощью другого набора кодов. Но более ранний метод дает мне гибкость, чтобы просто увидеть, заполняется ли форма правильно. :( – Bala

, тогда попробуйте использовать JSON.stringify или JSON.parse.it, может помочь. Но вышеупомянутый ответ будет не таким медленным. –

Использование JQuery сериализации функции :

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
$("button").click(function(){ 
$("div").text($("form").serialize()); 
}); 
}); 
</script> 
</head> 
<body> 
<form action=""> 
Name: <input type="text" name="name" value="Tina" /><br> 
Email: <input type="text" name="LastName" value="[email protected]" /><br> 
</form> 
<button>Export Values</button> 
<div></div> 
</body> 
</html>

выход будет: имя = Тина & LastName = тина% 40yopmail.com

источник

2015-01-06 13:32:00 Mohini

JQuery, заменяющий элементы формы текстом

ответ

Смежные вопросы