Question

我在我的系统中尝试做的是从电子邮件中复制人脚，并将其粘贴到txtarea，然后自动将其拆分为适当的字段：

姓名
名字
电子邮件
电话

问题是，如何自动检查哪一行（姓名，电话等）？我想：

如果我们在行中有“@”，我们知道这是电子邮件地址
如果我们有数字炎，我们知道这是一部电话（所以我们只需要复制数字和+之前的数字+）
另一行有两个单词应该是：第一个单词名称和第二个单词姓氏
并且应忽略任何其他行

HTML：

<form>

  <textarea name="footer" id="footer" rows="10" cols="30">
  John James
  tel. +44 (12) 345678
  john.james@gmail.com
  this two lines
  should be ignored
  </textarea><input type='button' id='click' value='convert'>
  <br>
  First name:<br>
  <input type='text' id='firstname'><br>
  Last name:<br>
  <input type="text" id="lastname"><br>
  Telephone:<br>
  <input type="text" id="telephone"><br>
  Email:<br>
  <input type="text" id="email">

</form>

JS：

document.getElementById('click').onclick = (function() { 
    alert('Just a test if button works');
});

这是我的jsfiddle： https://jsfiddle.net/89jqpxrq/

Answer 1

如果数据格式不会改变，那么您可以执行以下操作：

这是你的HTML（我稍微改了一下）：

<form>

  <textarea name="footer" id="footer" rows="10" cols="30">
  John James
  tel. +44 (12) 345678
  john.james@gmail.com
  this two lines
  should be ignored
  </textarea>
  <button id="convert" type="button" form="form" value="Convert">Convert</button>
  <br>
  First name:<br>
  <input type="text" name="firstname" id="firstname"><br>
  Last name:<br>
  <input type="text" name="lastname" id="lastname"><br>
  Telephone:<br>
  <input type="text" name="telephone" id="telephone"><br>
  Email:<br>
  <input type="text" name="email" id="email">

</form>

这是Javascript部分：

const doc = document;
doc.get = doc.getElementById;
function convert(event) {
    const text = doc.get('footer').value;
    const [name, telephone, mail] = text.split('\n').map(x => x.trim());
    const [first, last] = name.split(' ');

    doc.get('firstname').value = first.replace(/\s/g, '');
    doc.get('lastname').value = last.replace(/\s/g, '');
    doc.get('telephone').value = telephone.replace(/\s|[^0-9\+\(\)]/g, '');
    doc.get('email').value = mail.replace(/\s/g, '');
}
doc.get('convert').addEventListener('click', convert);

它遵循新的ES6语法，如果这是一个问题，那么这里是'标准'Javascript：

var doc = document;
doc.get = doc.getElementById;
function convert(event) {
    var text = doc.get('footer').value,
        array = text.split('\n').map(function(item){
            return item.trim();
        }),
        name = array[0],
        telephone = array[1],
        mail = array[2];
    array = name.split(' ');
    var first = array[0],
        last = array[1];

    doc.get('firstname').value = first.replace(/\s/g, '');
    doc.get('lastname').value = last.replace(/\s/g, '');
    doc.get('telephone').value = telephone.replace(/\s|[^0-9\+\(\)]/g, '');
    doc.get('email').value = mail.replace(/\s/g, '');
}
doc.get('convert').addEventListener('click', convert);

如果你做了一些假设：
- 名字总是Word Word Word ...（大写后跟小写）
- 电话仅包含+（）0-9（它不会检查括号是否匹配，您可以只相信客户该号码是正确的并假设他错过了一个括号，当您执行不点击的呼叫时（）反正。

const doc = document;
doc.get = doc.getElementById;

function convert(event) {
    const text = doc.get('footer').value;
    const info = {};
    const regexpName = /^([A-Z][a-z]+){2,}$/g;
    const regexpPhone = /[+()0-9]/g;
    const regexpMail = /(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

    let clean;
    text.split(/\n/).map(item => {
        item = item.trim();
        clean = item.replace(/\s/g, '');
        if(regexpName.test(clean)) {
            if(!info.name) {
                info.name = item.split(' ');
            }
        } else if(regexpPhone.test(clean)) {
            info.telephone = item.replace(/[^+()0-9]/g, '');
        } else if(regexpMail.test(item)) {
            info.mail = item.match(regexpMail)[0];
        }
    });
    info.last = info.name.pop();
    info.first = info.name.join(' ');


    doc.get('firstname').value = info.first;
    doc.get('lastname').value = info.last;
    doc.get('telephone').value = info.telephone;
    doc.get('email').value = info.mail;
}
doc.get('convert').addEventListener('click', convert);

Answer 2

这可能变得非常复杂，因为有很多可能的排列（就像有人把他们的手机和电子邮件放在同一条线上一样），但这可能会让你开始：

将textarea中的一行数组转换为变量：

var f = document.getElementById('footer').value.split("\n");

遍历数组中的每一行并进行一些检查以查看该行是否符合某些条件。如果是，请填写适用的字段：

for (var i = 0; i < f.length; i++) {
    if (f[i].indexOf('@') > -1) {
        // This is probably an email address
        document.getElementById("email").value = f[i];
    } else if (f[i].indexOf('0') > -1) {
        // This may be a phone number
        // Do something else here
    }
}

Answer 3

如果您输入与您的示例相同的数据，这意味着在新行中输入所有内容，请尝试

HTML

<form>

<textarea name="footer" id="footer" rows="10" cols="30">
John James
tel. +44 (12) 345678
john.james@gmail.com
this two lines
should be ignored
</textarea>
<button id="convert" type="button" form="form" value="Convert"/>Convert</button>
  <br>
  </form> 
  First name:<br>
  <input type="text" name="firstname" id="firstname"><br>
  Last name:<br>
  <input type="text" name="lastname" id="lastname"><br>
  Telephone:<br>
  <input type="text" name="telephone" id="telephone"><br>
  Email:<br>
  <input type="text" name="email" id="email">

的JavaScript

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type='text/javascript'>
    $(document).ready(function (){
   $("#convert").click(function(){
    //  alert('abc');
      var str= document.getElementById('footer').value;
    //alert(str);
      var dtail = str.split('\n');
    //alert(dtail[0]);
      var fnmAndLnm = dtail[0].split(" ");

      $('#firstname').val(fnmAndLnm[1]);
      $('#lastname').val(fnmAndLnm[2]);
      $('#telephone').val(dtail[1]);
      $('#email').val(dtail[2]);
     }); 
});  
</script>

Answer 4

你应该尝试使用JS函数：split

var str = "How are you doing today?";
var res = str.split(" ");

res的结果将是一个值为：

的数组

How,are,you,doing,today?

split（）方法用于将字符串拆分为子字符串数组，并返回新数组。

以下是如何使用的参考： http://www.w3schools.com/jsref/jsref_split.asp

如何将文本行拆分为适当的字段

4 个答案: