jquery添加更多表单项

发布于 2024-12-22 04:31:49 字数 421 浏览 4 评论 0原文

所以这是我的问题，我想要的是允许我们的销售人员在客户联系人中添加更多电话号码。

我们有一个看起来像这样的表格。（请注意，我只显示我们联系区域的部分）

<form>
<div id="numbers">
<input id="no1" value="" class="phone" type="numbers"/>
</div>
</form>

所以基本上我想要的就是当他们完成一个电话号码时，它会在其下方添加一个新的输入框，并询问他们是否还想添加。

然后我需要找出存储它们的最佳方法，有什么建议吗？

我的想法是将它们结合在一起，如下所示

025555555,0311555445,044585522

原文

So here is my question, what I am wanting is to allow our sales guys to add more phone numbers in a customers contact.

We have a a form which looks like this. (note I only showing the part from our contact area)

<form>
<div id="numbers">
<input id="no1" value="" class="phone" type="numbers"/>
</div>
</form>

so basically what I want is away that when they complete one phone number it adds a new input box below it and ask if any more they want to add.

I then need to work out the best way to store them, any suggestions?

My thinking was to join them together as the following

025555555,0311555445,044585522

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

跨年 2024-12-29 04:31:49

您需要在该字段上输入姓名，否则表单将不会随帖子一起提交。仅提交带有名称的输入。 _{当然，除非您通过 AJAX 提交并自己构建发布数据。}
不要将数据存储为逗号分隔值。为电话号码保留一个单独的表，并在人员与其电话号码之间使用一对多关系。标准化数据（几乎）总是正确的方法。
您真的需要无限的电话号码吗？或者一些小的、固定的数字就足够了？比如说电话、备用电话和手机？如果 3 可以，为什么不只创建三个文本框并将后两个设置为可选呢？
您可以使用如下所示的内容：

示例：

$(function() {
     $(document).on('blur','[name="phone"]', function() {
         var $phones = $('[name="phone"]'),
             empty = $phones.filter( function() { return !$(this).val(); } ).length;
         if (empty == 0) { // don't add a new one unless they all have values
            $phones.filter(':last').after( '<input type="text" name="phone" class="phone" type="numbers" />' );
         }
     });
});

You need a name on that field or the form won't submit it with the post. Only inputs with names get submitted. _{Unless, of course, you're submitting via AJAX and constructing the post data yourself.}
Don't store the data as comma-separated values. Keep a separate table for phone numbers and use a one-to-many relationship between the person and their phone numbers. Normalized data is (almost) always the right way to go.
Do you really need unlimited phone numbers? Or would some small, fixed number suffice? Say, phone, alternate phone, and cell? If 3 would do, why not just create the three text boxes and make the latter two optional?
You can use something like the following:

Example:

$(function() {
     $(document).on('blur','[name="phone"]', function() {
         var $phones = $('[name="phone"]'),
             empty = $phones.filter( function() { return !$(this).val(); } ).length;
         if (empty == 0) { // don't add a new one unless they all have values
            $phones.filter(':last').after( '<input type="text" name="phone" class="phone" type="numbers" />' );
         }
     });
});

回复收藏 0 原文

顾忌 2024-12-29 04:31:49

试试这个演示 - http://jsfiddle.net/cAMAe/2/

$('#numbers input').last().keypress(function() {
  if($('#numbers input').last().val().length > 5)
  {
     $(this).clone('false').appendTo("#numbers");
    $('#numbers input').last().val('');
  }
});

只需将 id 更改为 class 。如果由于某种原因您无法删除 id，请在 if 块内执行以下操作

$input = $('#numbers input').last();
$input.clone(false).find("*").attr("id",$input.attr("id")+'111').attr('value','').appendTo("#number");

Try this demo - http://jsfiddle.net/cAMAe/2/

$('#numbers input').last().keypress(function() {
  if($('#numbers input').last().val().length > 5)
  {
     $(this).clone('false').appendTo("#numbers");
    $('#numbers input').last().val('');
  }
});

Just change id to class . If due to some reason you cannot remove the id do the folowing inside the if block

$input = $('#numbers input').last();
$input.clone(false).find("*").attr("id",$input.attr("id")+'111').attr('value','').appendTo("#number");

回复收藏 0 原文

阳光下的泡沫是彩色的 2024-12-29 04:31:49

我的想法是这样的：

register(1);
function register(i)
{
    $('#no'+i).blur(function()
    {
        if($('#no'+i).val().get().matches(reg))
        {
            generated_id="#no"+++i;
            $('#numbers').append('<div><input type="text" id='+generated_id+'...></div>')
            register(i);
        }
    })
}

What I think, is like this:

register(1);
function register(i)
{
    $('#no'+i).blur(function()
    {
        if($('#no'+i).val().get().matches(reg))
        {
            generated_id="#no"+++i;
            $('#numbers').append('<div><input type="text" id='+generated_id+'...></div>')
            register(i);
        }
    })
}

回复收藏 0 原文

~没有更多了~