Question

我正在尝试为一组具有（可能）相同数据的表单字段创建自动填充功能。我的情况如下：我有一个表格，其中用户输入联系信息，供在公司（股东，官员，承包商，员工）中担任特定角色的人员使用。所以，例如：

对于我拥有的股东：

First Name:
Last Name:
Email:
Telephone:
Street:
City:
State:
Zip:

对于导演我有相同的字段：

First Name:
Last Name:
Email:
Telephone:
Street:
City:
State:
Zip:

通常，两者之间存在很多重叠（董事通常是公司的股东）。因此，如果用户填写 Don Draper在纽约Ossining的子弹公园路42号作为股东，然后想要将他添加为导演，我希望提供某种自动填充功能来填写信息当他们开始填写导演职能时。

我想我可以从头开始编写一个JavaScript插件，但是我想知道我是否可能不需要重新发明轮子。在jquery中有什么东西会照顾我的大部分内容吗？或者是否有一套最佳做法？随意分享。

我当然不是在寻找任何人为我写这篇文章，但是对于正确方向的推动将会受到赞赏。

预期的解决方法 我确实认识到，如果我只是为一般人提供字段，然后在该人之上动态添加角色（股东，董事或其他），就可以避免对此的需求。我更喜欢按照我上面出于组织原因描述的那样构建它。

非常感谢任何建议！

Answer 1

我继续做了一个小小的演示，如果注意到这个名字是相同的话就会填写一个人。 http://jsfiddle.net/Grimbode/fqhrqwzt/1/（验证一个人..填写输入行时单击复选框）

您需要创建搜索脚本客户端。为了能够有效地做到这一点并浪费尽可能少的时间，您将创建一个与每个被填写者相关的信息列表。

您最初需要创建：

var persons = [];

下一部分你有几个选择：

您可以通过创建另一个persons列表来填充{}，其中您填写的信息如下：{ first: 'john', last: 'smith' /* ... */}
你可以像这样创建一个人类：

<强>类别：

function Person(o){
  this.first = o.first || 'unknown';
  this.last = o.last || 'unknown';
  //rest of the attributes
}

正在使用

persons.push(new Person({
  first: 'john',
  last: 'smith'
}));

然后你创建一个:(假设你的表单的类名是＆＃39; .person＆＃39;）

$('.person input').on('keyup', function(){
    var $this = $(this);
    var n = $this.attr('name'); //supposing the input name corresponds to the kind of input it is ( first, last, email, number, etc )
    var v = $this.val();

//now you need to loop through persons and see if you get a hit
$.each(persons, function(a, b){
        if(n === 'first' && b.first === v){
            $this.next().val(b.last);
        }else if(n === 'last' && b.last ===v){
            $this.prev().val(b.first);
        }
    });
});

您可能不希望每次按键时都检查，但是当他们改变输入时。您必须使用.on('change', function(){})事件。

不幸的是，我不确定是否存在类似的东西。如果是这样，您仍然需要根据您的具体要求进行调整。

请注意，您还可以使用js类创建getters和setters。

Person.prototype.function = getFirst(){
  return this.first;
}

Jquery Autofill重复表单字段

1 个答案: