заполняет (несколько) полей в форме HTML/JQuery

Question

Я перепроектирую форму регистрации для своей компании. К сожалению, мне кажется, что я нахожусь над моей головой. лол.

Что мне нужно сделать, так это создать веб-форму для мобильного тематического сайта. На данный момент у меня есть сайт более или менее функционирующий с помощью JQuery Mobile, но я борюсь с аспектом ввода формы. Одна из вещей, которые должна выполнять эта форма, - это заполнить 3 поля, когда пользователь нажимает кнопку.

Так, например, если у меня есть кнопка, которая говорит «Турция, пюре из картофеля & Вино» ... когда пользователь нажимает эту кнопку, 3 поля под ней заполнят значениями «Турция», «Картофельное пюре» »и« Вино ».

Можно ли это сделать?

Answer 1

Вы можете использовать jQuery's .val(), чтобы установить значение текстового поля.

<div id="pop">Turkey, Mashed Potato &amp; Wine</div> 
<input type="text" id="f1" /> 
<input type="text" id="f2" /> 
<input type="text" id="f3" />​ 

$("#pop").click(function() { 
    $("#f1").val("Turkey"); 
    $("#f2").val("Mashed Potato"); 
    $("#f3").val("Wine"); 
});​ 

Demo

Answer 2

Я хотел бы сделать это следующим образом, если только я вас правильно.

HTML:

<form> 
    <input type="text"> 
    <input type="text"> 
    <input type="text"> 
</form> 
<button data-val="Turkey|Mashed Potato|Wine">Turkey, Mashed Potato & Wine</button> 

JavaScript:

$("button").on("click", function() { 
    var val = $(this).data("val").split("|"); 
    $("form input").val(function(i) { 
     return val[i] || ""; 
    }); 
}); 

DEMO:http://jsfiddle.net/8aHtP/

Answer 3

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

$(function(){ 
    $('#my_button').on('click', function(e){ 
    $('#field_one').val('Turkey'); 
    $('#field_two').val('Mashed Potato'); 
    $('#field_three').val('Wine'); 
    }); 
}); 

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

$(function(){ 
    $('#my_button').on('click', function(e){ 
    var parts = $(this).attr('value').split(','); 

    // do some more work here to clean up the values, 
    // you'd need the values separated with commas all 
    // the way through (ie: Turkey, Mashed Potato, Wine) 

    $('#field_one').val(parts[0]); 
    $('#field_two').val(parts[1]); 
    $('#field_three').val(parts[2]); 
    }); 
}); 

Answer 4

Да, это возможно. Один из способов сделать это - поместить значения в атрибут данных и добавить их.

Рабочий пример: http://jsfiddle.net/vj3Zg/