0

ユーザーがクリックする回数だけ特定のフィールドを複製するオプションが必要なフォームで忙しいので、それを電子メールで送信する必要があるため、現在パスポートフィールドにいます。

唯一の問題は、私が設定した方法は、クラスが「passport」であるdiv要素ごとに入力フィールドを作成することです。したがって、フィールドIDは次のようになります。

1 2 3 4 5 6 7 8 9 10 11 12 13

そして、jQueryクローンを使用する場合：

1 2 3 4 5 6 7 8 9 10 11 12 13 1 2 3 4 5 6 7 8 9 10 11 12 13

そして私がそれを必要とするもの：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

しかし、フィールドの値を評価するために、その1つの入力に関連付けられるIDの最初のセットのみを割り当てるにはどうすればよいですか。

とにかく、どんな助け/アドバイスも大いに感謝します。

ここにjsfiddleがあります：http：//jsfiddle.net/dawidvdh/A5naZ/

コードは次のとおりです。

jQuery：

    $(document).ready(function() {
    var pass = 1;
    val = 0;
jQuery('div.passport').each(function() {
    var index = "pass"+pass++;
    var passer = "<input class='pass' id="+'"'+index+'"'+" "+" maxlength='1' />";
    var passvalue = $(this).attr('value');
    jQuery(passer).appendTo('#pass');
});

$("#clone").click(function () {
    $('#pass').clone().insertAfter("#pass");
});

function Validatepass() {
    var passValue = '';
    $('.pass').each(function(){ passValue+=($(this).val());});    
    jQuery('#error p').remove();
    var error = jQuery('#error');
    var passNumber = passValue;
    var correct = true;
    if (passNumber.length != 13) {
        correct = false;
    }
    // if no error found, hide the error message
    if (correct) {
        jQuery('.pass').css("border","1px solid #9A8B7D");
    }
    // otherwise, show the error
    else {
        jQuery('.pass').css("border","1px solid #FF0000");
    }
    return false;
}

$('input.pass').keydown(function(e){
    if(e.keyCode == 8){
        $(this).val('');
        $(this).prev().val('');
        $(this).prev().focus();
         Validatepass();
    }
});  

$('input.pass').on('keyup', function(){
    if (this.value.match(/\d+/)) {
        var $this = $(this);
        if ($this.next('input').length) {
          $this.next().focus();
        } else {
          Validatepass();
        }  
    }
});
});

およびHTML：

<div id="pass"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<div class="passport"></div>
<button id="clone">duplicate</button>
4

1 に答える 1

0

クリック機能をこれに変更します

$("#clone").click(function () {
    var clonedObj=$('#pass').clone().insertAfter("#pass");
    clonedObj.find('.pass').each(function(){
       this.id='pass' + pass++;
    });
    clonedObj[0].id="WatEverUWant";
});

編集：このjsfiddleを確認してください

編集2：2番目のコメントに従って、uidがクローンのを変更することを意味する場合divは、コードに追加されます。

于 2012-12-11T07:03:24.803 に答える