Question

这可能看起来很奇怪，但我希望能够使用通过GET参数列表传递的值填写静态Web表单。

说我有一个页面'self.html'：

<form action="self.html" method="get" accept-charset="utf-8">
  <label for = "40">New Question?</label>
  <input type="radio" name="40" id="40" value="Yes"> Yes &nbsp;
  <input type="radio" name="40" id="40" value="No"> No
  <label for = "41">What's your favourite colour?</label>
  <input type="text" name="43" value="" id="41">
</form>

我需要表单在输入发生变化时自行提交：

  $(document).ready(function(){
    $('input').change(function(){
      $("form:first").submit();
    });
    // collate_results();
  });

但显然我想保留这些值，以便在重新加载时不会重置它们。

（为什么？因为我是在FileMaker Web视图中进行的，从表单中提取数据的唯一方法是获取源 - url - 并解析它...因此我需要更新url反映表单的当前状态，并且还能够传递我想要显示的任何新记录的数据...）

更新：

这是我的非工作代码 - 它是很好的单值字段，但无法用于单选按钮......

$('input').change(function(){
  $("form:first").submit();
});
var qString = jQuery.url.attr("query");
if(qString) {
  qString = qString.split("&");
  $(qString).each( function() {
    var parts = this.split("=");
    var item = $('#'+parts[0]);
    if($(item).attr('type') == 'text') {
      $('#'+parts[0]).val(parts[1]);
    };
    if($(item).attr('type') == 'radio') {
      $(item).each(function() { 
        console.log(this);
        if($(this).val() == parts[1]) {
          $(this).attr('checked','checked');
        } else {
          $(this).attr('checked','');
        }
      });
    };
  })
}
});

问题是我将在表单上有多个单选按钮，其值为yes，no，na，因此jQuery想要这样做的方式似乎不适用。如果有帮助，我可以重新识别单选按钮......

<form action="self.html" method="get" accept-charset="utf-8">
  <label for = "40">New Question?</label>
  <input type="radio" name="47" id="47_yes" value="Yes">Yes &nbsp;
  <input type="radio" name="47" id="47_no" value="No" checked> No
  <label for = "48">What's your favourite colour?</label>
  <input type="text" name="48" value="" id="48">
</form>

Answer 1

更好的方法是每次输入更改时实施AJAX提交但是要阅读GET参数，您可以将此插件http://www.mathias-bank.de/2007/04/21/jquery-plugin-geturlparam-version-2/用于jQuery。

Answer 2

这是一些有用的东西......但仍然存在url编码和值解码的问题......

$(document).ready(function(){
  $('input').change(function(){
    $("form:first").submit();
  });
  var qString = jQuery.url.attr("query");
  if(qString) {
    qString = qString.split("&");
    $(qString).each( function() {
      var parts = this.split("=");
      var items = $("input[name^='"+parts[0]+"']");
      var myval = decodeURI(parts[1]);
      $(items).each(function() {
        var item = this;
        if($(item).attr('type') == 'text') {
          $('#'+parts[0]).val(myval);
        };
        if($(item).attr('type') == 'radio') {
          if($(item).val() == myval) {
            $(item).attr('checked','checked');
          } else {
            $(item).attr('checked','');
          }
        };
      });
    })
  }
});

使用jQuery重置来自GET url params的输入值

2 个答案: