Question

好的，

让我们说我正在创建一个表单。它的地址形式，形式元素如下：

field 1 / house number
field 2 / street name
field 3 / suburb 
etc etc etc

有人填写表格，：

1
smith street
townsville

我想要什么（类似于堆栈溢出的实时表单）是另一个表单元素，它传播表单字段条目LIVE但用文本替换空格：

所以看起来像是：1+snith+street+townsville

最后有一个搜索按钮。然后，这会触发我们已经完成的脚本的其余部分，基本上抓住地址的纬度和长度并显示gmap。

基本上就是这样，但我们需要在表格上和提交之前发生这一切。

任何帮助表示赞赏，已经问过其他几个地方。没有快乐，但总是使用StackOverflow .. 谢谢Ozzy

Answer 1

$('#my_form input').change(function() {
  var new_text = '';
  $('#my_form input').each(function() {
    new_text += $.trim($(this).val()).replace(' ', '+') + '+';
  });
  $('#my_display').val(new_text);
});

Answer 2

这里可能有用。。

$(document).ready(function(){

  $('body').live('keypress', function (event) {

    if ($(event.target).hasClass('form-element')) {
      var text;
      $('#yourform input.form-element').each(function() {
        text += $(this).attr('value') + '+';
      });

      $('#yourtargetelementthatwillholdallthenames').attr('value', text.substring(0,text.length - 1))
    }

  });

});

我没有在浏览器中试过这个，但试一试。可能需要根据您的需要进行一些调整。

Answer 3

如果您要为搜索提交此内容，请改用encodeURIComponent()，以便对所需内容进行编码，如下所示：

$("#form1 input[type=text]").bind("keyup change", function() {
  var vals = $("#form1 input[type=text]").map(function() { return this.value; });
  $("#otherField").val(encodeURIComponent(vals.join(" ")));
});

将表单元素添加到一个表单元素

3 个答案: